SpringMVC 、JSP、Servlet中的相对路径和绝对路径完全手册

HTML、SpringMVC 、JSP、Servlet中的相对路径和绝对路径完全手册

一、HTML 中使用 相对路径的方式 

目录结构 
/ index.html
/js/ chbk.js
/css/ style.css
/images/ bk1.jpg bk2.jpg

1. style.css代码
@charset "utf-8";
/* CSS Document */
body{background-color:#ccc;}
#content{background:url(../images/bk1.jpg) no-repeat;width:200px;height:200px;margin:auto;}
#in{margin:auto;text-align:center;}
 其中, url(../images/bk.jpg) 路径是相对于style.css的。

2.chbk.js代码  (建议使用绝对路径)
// JavaScript Document
function chbk(){
document.getElementById('content').style.backgroundImage='url(images/bk2.jpg)';
}
其中, url(images/bk2.jpg) 路径是相对于index.html的,而不是chbk.js的 url(../images/bk.jpg)
 
(建议使用绝对路径)
var path =  <%=request.getContextPath() %>;
url(path/images/bk2.jpg)

 3、JS中的AJAX使用的路径,同上JS的使用方式
            AJAX请求控制器的路径为:
             $.ajax(url: /SSM-Test2/handleservlet)  
             $.ajax(url:<% request.getContentPath()%>/user/a.jsp)

4.index.html代码    引用文件使用相对路径   使用了相对路径
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
< html xmlns =" http://www.w3.org/1999/xhtml " >
< head >
< meta http-equiv ="Content-Type" content ="text/html; charset=utf-8" />
< title >引入Html中的css、js的路径问题 </ title >
< link href ="css/style.css" rel ="stylesheet" type ="text/css" />           //
< script src ="js/chbk.js" type ="text/javascript" ></ script >
</ head >

< body >
< div id ="content" >
</ div >
< div id ="in" >
< input class ="in" type ="button" value ="单击我更改背景" onclick ="chbk()" />
</ div >

</ body >
</ html >

 
建议:js中的路径引用应该采用绝对路径,可以通过定义一个全局变量如path来活动项目的真实路径(像jsp中就可以用 request.getSession().getServletContext().getRealPath("/")),然后在每个路径上加上path( path+你的路径)从而取出路径错误的问题。

< script src =" <%=request.getContextPath() %>/ js/chbk.js" type ="text/javascript" ></ script >
或者:
var path =  <%=request.getContextPath() %>;
< script src =" path/ js/chbk.js" type ="text/javascript" ></ script >






4、HTML元素
(1)、属性中使用相对路径
<link href="one.css" rel="stylesheet" type="text/css">,
  one.css:表示one.css和a.hmtl处于同一个目录
  user/one.css:表示one.css处于a.html所在目录的子目录user中,即user是a.html在同一个目录 。

(2)、属性中使用绝对路径
<link href="/项目名/one.css" rel="stylesheet" type="text/css">,

(3)、属性中使用绝对路径(jsp 页面中才能使用 )
<link href=" <%=request.getContextPath() %>/one.css" rel="stylesheet" type="text/css">,



二、服务器端JAVA中使用

/webapps
/webapps/ SSM-Test
/webapps/SSM-Test/WEB-INF/views/index.jsp

1  、JAVA中使用的都是 自带项目名称,例如: http://localhost:8080/ SSM-Test/
JSP
            forward:<%request.getRequestDispatcher("WEB-INF/views/index.jsp ")%>
            redirect:<%response.sendRedirect("WEB-INF/views/index.jsp");%>

 此路径就是相对于当前项目的:

2、  action中(使用同上) :
      ACTION转发时,默认到容器TOMCAT:WEBAPPS下的项目中 SSM-Test中找此路径
      所为使用方式为:
      return  /WEB-INF/views/index.jsp 


猜你喜欢

转载自blog.csdn.net/u013756305/article/details/78124196