相对路径与绝对路径

第一部分:相对路径
◆◆以下是文件a.html中引用css的方式

Java代码 复制代码 收藏代码
  1. <link href= "a.css" rel= "stylesheet" type= "text/css" >
  2. <link href="./a.css" rel= "stylesheet" type= "text/css" >
  3. <link href="styles/a.css" rel= "stylesheet" type= "text/css" >
  4. <link href="../a.css" rel= "stylesheet" type= "text/css" >
  5. <link href="../../a.css" rel= "stylesheet" type= "text/css" >
  6. a.css: 表示a.css和a.html处于同一个目录
  7. ./a.css: 表示a.css和a.html处于同一个目录
  8. styles/a.css: 表示a.css位于a.html所在目录的子目录styles中
  9. ../a.css: 表示a.css位于a.html上一级目录下
  10. ../../a.css: 表示a.css位于a.html上一级目录的上一级目录下
  11. 这里所说的上一级并不一定指的项目中文件夹的上一级,而指的的URL地址中的上一级,比如说/Blog/photo/match/user.do 和 WebRoot/js/match/jquery.js是属于../../js/match/jquery.js的关系,因为两个“../”后地址实际就变成了/blog/js/match/jquery.js了。
<link href="a.css" rel="stylesheet" type="text/css">
<link href="./a.css" rel="stylesheet" type="text/css">
<link href="styles/a.css" rel="stylesheet" type="text/css">
<link href="../a.css" rel="stylesheet" type="text/css">
<link href="../../a.css" rel="stylesheet" type="text/css">

a.css:        表示a.css和a.html处于同一个目录
./a.css:      表示a.css和a.html处于同一个目录
styles/a.css: 表示a.css位于a.html所在目录的子目录styles中
../a.css:     表示a.css位于a.html上一级目录下
../../a.css:  表示a.css位于a.html上一级目录的上一级目录下




第二部分:绝对路径
◆◆假设
Http地址为http://192.168.0.1/
web应用为webapp
那么web应用URL为http://192.168.0.1/webapp/

web应用的目录结构:

Java代码 复制代码 收藏代码
  1. webapp
  2. ├─WEB-INF
  3. │ ├─classes
  4. │ ├─lib
  5. │ └─web.xml
  6. ├─pages
  7. │ ├─a.jsp
  8. │ ├─a.css
  9. │ ├─a.js
  10. │ └─b.jsp
  11. ├─images
  12. ├─styles
  13. │ ├─c.css
  14. │ └─d.css
  15. └─scripts
  16. ├─e.js
  17. └─f.js
webapp
 ├─WEB-INF
 │   ├─classes
 │   ├─lib
 │   └─web.xml
 │
 ├─pages
 │   ├─a.jsp
 │   ├─a.css
 │   ├─a.js
 │   └─b.jsp
 │
 ├─images
 ├─styles
 │   ├─c.css
 │   └─d.css
 └─scripts
      ├─e.js
      └─f.js



◆◆绝对路径使用“/”字符
浏览器IE和服务器Servlet解释绝对路径的“/”字符方式不同:
浏览器:http://192.168.0.1/
服务器:http://192.168.0.1/webapp

◆◆以下路径由浏览器IE解释
form表单的action属性
错误:action="/pages/a.jsp"
正确:action="/webapp/pages/a.jsp"

css文件的引用
错误:<link href="/styles/c.css" rel="stylesheet" type="text/css"/>
正确:<link href="/webapp/styles/c.css" rel="stylesheet" type="text/css"/>

pages/a.jsp文件中的css文件引用
错误:<link href="a.css" rel="stylesheet" type="text/css"/>
错误:<link href="./a.css" rel="stylesheet" type="text/css"/>
正确:<link href="/webapp/pages/a.css" rel="stylesheet" type="text/css"/>

js文件的引用
错误:<script type="text/javascript" src="/scripts/e.js">
正确:<script type="text/javascript" src="/webapp/scripts/e.js">

pages/a.jsp文件中的js文件引用
错误:<script type="text/javascript" src="a.js">
错误:<script type="text/javascript" src="./a.js">
正确:<script type="text/javascript" src="/webapp/pages/a.js">

Servlet中的代码
错误:response.sendRedirect("/pages/a.jsp");
正确:response.sendRedirect("/webapp/pages/a.jsp");

◆◆以下路径由服务器Servlet解释
Servlet中的代码
错误:request.getRequestDispatcher(“/webapp/pages/a.jsp”)
正确:request.getRequestDispatcher(“/pages/a.jsp”)

JSP中的Elements
错误:<%@ include file="/webapp/pages/a.jsp" %>
正确:<%@ include file="/pages/a.jsp" %>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值