WEB 工程路径

WEB 工程路径

相对路径

使用相对路径来解决, 一个非常重要的规则:页面所有的相对路径,在默认情况下,都会参考当前浏览器地址栏的路径 http://ip:port/工程名/ + 资源来进行跳转。

相对路径带来的问题

请添加图片描述

如上图,若在a.html界面使用相对路径访问my.css的资源,浏览器会定位到web/d1/d2/my.css,这显然不是资源所在的位置。

base 标签

如果需要指定页面相对路径参考的的路径,可以使用 base 标签来指定

1)base 标签是 HTML 语言中的基准网址标记,它是一个单标签,位于网页头部文件的 head标签内

2)一个页面最多只能使用一个 base 元素,用来提供一个指定的默认目标,是一种表达路径和连接网址的标记。

3)常见的 url 路径形式分别有相对路径与绝对路径,如果 base 标签指定了目标,浏览器将通过这个目标来解析当前文档中的所有相对路径,包括的标签有(a、img、link、form)

4)也就是说,浏览器解析时会在路径前加上 base 给的目标,而页面中的相对路径也都转换成了绝对路径。使用了 base 标签就应带上 href 属性和 target 属性

示例:

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>a.html</title><!-- 将以 base 指定的 href 的地址为路径,来确定 超链接的路径--><base href="http://localhost:8080/"></head><body><h1>这是 a.html</h1>  <!-- 这里的路径为:http://localhost:8080/d1/d2/b.html--><a href="d1/d2/b.html">跳转到/d1/d2/b.html</a> <br/><br/><a href="xxx">转发到/d1/d2/b.html</a> </body>
</html>

注意事项和细节

1)相对路径

  • .表示当前目录
  • ..表示上一级目录
  • 资源名 表示当前目录/资源名

2)在实际开发中,路径都使用绝对路径,而不是相对路径

3)在 web 中 / 斜杠 如果被浏览器解析,得到的地址是:http://ip[域名]:port/

4)在 web 中 / 斜杠 如果被服务器解析,得到的地址是:http://ip[域名]:port/工程路径/

下面的几种情况就是如此:

  • <url-pattern>/servelturl</url-pattern>
  • servletContext.getRealPath(“/”); ==> 是得到执行路径/工作路径
  • request.getRequestDispatcher(“/”);

5)在 javaWeb 中 路径最后带 / 和 不带 / 含义不同

  • 最后带 / 表示这是一个路径
  • 最后不带 / 表示这是一个资源

6)重定向 response.sendRediect("/"); 这条语句虽然是在服务器执行的,但是,服务器是把斜杠 / 发送给浏览器解析。因此得到地址 http://ip[域名]:port/

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/589766.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

黄锈水过滤器 卫生热水工业循环水色度水处理器厂家工作原理动画

​ 1&#xff1a;黄锈水处理器介绍 黄锈水处理器是一种专门用于处理“黄锈水”的设备&#xff0c;它采用机电一体化设计&#xff0c;安装方便&#xff0c;操作简单&#xff0c;且运行费用极低。这种处理器主要由数码射频发生器、射频换能器、活性过滤体三部分组成&#xff0c;…

MySQL的基本操作(超详细)

&#x1f468;‍&#x1f4bb;作者简介&#xff1a;&#x1f468;&#x1f3fb;‍&#x1f393;告别&#xff0c;今天 &#x1f4d4;高质量专栏 &#xff1a;☕java趣味之旅 &#x1f4d4;&#xff08;零基础&#xff09;专栏&#xff1a;MSQL数据库 欢迎&#x1f64f;点赞&…

execl产品排行分析

产品排行分析 1.原数据 2.透视表 选择日期--数据--组合 效果如下&#xff1a; 修改透视表排版&#xff1a; 3.提取数据 将需要分析的数据拷贝至新的表中&#xff1a; 4.排序 1996年度进行排序 效果 添加名次 效果 同理处理1997年度数据和排行 新增一列&#xff1a; 名次变…

源聚达科技:抖音开网店步骤难吗

在数字化浪潮的推动下&#xff0c;抖音平台不仅成为了人们娱乐休闲的好去处&#xff0c;更是许多创业者眼中的“金矿”。然而&#xff0c;对于初次尝试在抖音开设网店的朋友来说&#xff0c;难免会对开店流程感到疑惑。究竟开设一个抖音网店的难度如何呢?让我们一探究竟。 要明…

04 Python进阶:MySQL-PyMySQL

什么是 PyMySQL&#xff1f; PyMySQL 是一个用于 Python 的纯 Python MySQL 客户端库&#xff0c;提供了与 MySQL 数据库进行交互的功能。PyMySQL 允许 Python 开发人员连接到 MySQL 数据库服务器&#xff0c;并执行诸如查询、插入、更新和删除等数据库操作。 以下是 PyMySQL …

SSL证书有哪些种类?有免费的吗?

SSL证书主要有以下几种类型&#xff1a; 1. 域名验证型SSL证书 (DV SSL)&#xff1a; - 仅对申请者的域名所有权进行验证&#xff0c;无需人工验证申请单位的真实身份。 - 审核快速&#xff0c;通常适用于个人网站、小型组织或各类加密应用。 2. 组织验证型SSL证书 (OV…

9.动态规划——4.最长公共子序列(动态规划类的算法题该如何解决?)

例题——最长公共子序列(一) 分析 设最长公共子序列 d p [ i ] [ j ] dp[i][j] dp[i][j]是 S 1 S_1 S1​的前 i i i个元素&#xff0c;是 S 2 S_2 S2​的前 j j j个元素&#xff0c;那么有&#xff1a; 若 S 1 [ i − 1 ] S 2 [ i − 1 ] S_1[i-1]S_2[i-1] S1​[i−1]S2​[…

E-魔法猫咪(遇到过的题,做个笔记)

题解&#xff1a; 来自学长们思路&#xff1a; 其中一种正解是写单调队列。限制队列内的数单调递增&#xff0c;方法为每当新来的数据比当前队尾数据小时队 尾出列&#xff0c;直到能够插入当前值&#xff0c;这保证了队头永远是最小值。因此总体思路是队尾不断插入新值的同时 …

ABAP Restful接口

文章目录 ABAP Restful接口代码 ABAP Restful接口 代码 METHOD if_http_extension~handle_request.TYPES: BEGIN OF parameter,name TYPE string,value TYPE string,END OF parameter.TYPES : BEGIN OF ty_material,werks TYPE marc-werks, "工厂matnr TYPE mara-matnr, …

GDPU Java 天码行空6

一、实验目的 1、理解设计模式的基本思想&#xff1b; 2、理解并掌握常用的几种设计模式&#xff1b; 3、根据需求编写简单工厂设计模式&#xff1b; 4、根据需求编写适配器设计模式&#xff1b; 二、实验内容和步骤 1. 简单工厂模式实现计算器 请用简单工厂模式设计并编码…

自动驾驶传感器:传感的本质

自动驾驶传感器&#xff1a;传感的本质 附赠自动驾驶学习资料和量产经验&#xff1a;链接 0. 前言 这个系列的背景是&#xff1a;工作时候需要攒一台数据采集车辆&#xff0c;那段时间需要熟悉感知硬件&#xff0c;写了不少笔记&#xff0c;都是些冗长的文章&#xff0c;感兴…

Vue3从入门到实战:路由的query和params参数

在Vue 3中&#xff0c;我们可以通过路由的查询参数来传递数据。这意味着我们可以在不同的页面之间传递一些信息&#xff0c;以便页面可以根据这些信息来显示不同的内容或执行不同的操作。 查询参数的使用方式类似于在URL中添加附加信息&#xff0c;以便页面之间可以根据这些信息…