jsp引入js时的绝对路径和相对路径

最新推荐文章于 2024-09-08 22:25:25 发布
最新推荐文章于 2024-09-08 22:25:25 发布
阅读量3.5w 收藏 37
点赞数 4
分类专栏： 相对路径和绝对路径问题 文章标签： jsp页面中路径问题
一．问题
    JSP中究竟采用绝对路径还是采用相对路径随着所采用技术的越来越复杂，这个问题也变得越来越难以解决。
１）采用相对路径遇到的问题
l         相对路径固然比较灵活，但如果想复制页面内的代码却变得比较困难，因为不同的页面具有不同的相对路径，复制后必须修改每一个连接的路径。
l         如果页面被多于一个的页面所包含，那么被包含页面中的相对路径将是不正确的。
l         如果采用Struts的Action返回页面，那么由于页面路径与Action路径不同，使得浏览器无法正确解释页面中的路径，如页面为/pages /cust/cust.jsp，图片所有目录为/images/title.gif，这时在/pages/cust/cust.jsp中的所用的路径为”../../images/title.gif”，但是如果某一个Action的Forward指向这个JSP文件，而这个Action的路径为 /cust/manage.do，那么页面内容中”../../images/title.gif”就不再指向正确的路径了。
解决以上问题似乎只有使用绝对路径了。
２）采用绝对路径遇到的问题
l         随着不同的Web应用发布方式，绝对路径的值也不同。如Web应用发布为MyApp，则路径”/MyApp/images/title.gif”是正确的，但发布为另一应用时如MyApp2，这个路径就不对了，也许这个情况比较少，但以default方式发布Web应用时以上绝对路径也不同：”/images/title.gif”。
 

二．解决方案
１）采用绝对路径，但为了解决不同部署方式的差别，在所有非struts标签的路径前加${pageContext.request.contextPath}，如原路径为：
”/images/title.gif”，改为
“${pageContext.request.contextPath}/images/title.gif”。
代码” ${pageContext.request.contextPath}”的作用是取出部署的应用程序名，这样不管如何部署，所用路径都是正确的。
缺点：
操作不便，其他工具无法正确解释${pageContext.request.contextPath}
２） 采用相对路径，在每个JSP文件中加入base标签，如：

这样所有的路径都可以使用相对路径。
缺点：
对于被包含的文件依然无效。
    真正使用时需要灵活应用１）和２），写出更加健壮的代码。

在使用的时候可以使用${pageContext.request.contextPath}，也同时可以使 用 


在jsp页面中添加base，可用相对路径：

<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

 

然后在<head>标签内添加base

<base href="<%=basePath%>"></base>

 

　在本页面中“直接”引入外部文件时，可直接

复制代码 
<script src="js/common/jquery-1.11.1.min.js" language="javascript"
    type="text/javascript"></script>
<script src="js/common/frame.js" language="javascript"
    type="text/javascript"></script>
<link href="css/common/frame.css"
    rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
复制代码

同理，本页面中的css类

复制代码 
.top {
    position: absolute;
    left: 0;
    top: 95px;
    right: 0;
    height: 120px;
    background: url(images/common/title.jpg) repeat-x
}
复制代码

========例外情况：引入的外部css、js文件又引入image等时

这时候如果也用相对路径的话，因为已经不在了jsp页面中，此时相对路径是相对于本css文件所在的目录：

如：棠棣新系统，index.jsp页面中引入的css文件

<link href="css/common/frame.css" rel="stylesheet" type="text/css" />

这时在jsp页面中，引入的js/common/frame.js是从网站跟目录开始寻找，没问题。

但在frame.js中有如下css

.show_menu{
    background-image: url(images/left_bg.gif);
    background-repeat: repeat-y;
    background-position:285px 51px;
}

这种情况下直接url(images/left_bg.gif);是默认从本css文件所在目录（/css/common/frame.css）+url(images/left_bg.gif)，所以此处需要的image需要单独配置，

改成

.show_menu{
    background-image: url(../../images/left_bg.gif);
    background-repeat: repeat-y;
    background-position:285px 51px;
}

指尖de柔情
关注
专栏目录
JSP页面中引入js文件
ppzhangj的专栏
08-13 9万+
1）引入的js文件出错，  检查方法：将Js的内容写在当前的页面的 之间，看是否能够正常运行，如果不能，请核查代码  2) 如果引入的代码在当前页面中能够正常运行，但当引入时不能正常运行，则有两种可能     A:引入Js的路径有问题     B:引入的Js的编码格式与当前页面不匹配；  3)引入Js的路径问题     js的引入不外乎两种，相对路径与绝对路径    test.js
servlet --相对路径和绝对路径 一
m0_51286391的博客
11-28 725
前言     路径就是文件存放的位置，当我们设计程序中需要使用相应文件，就必须依据存放位置准确找到文件，从而调用使用文件。在windows操作系统中，当我们获取文件时，如果是从盘符开始,即从根目录开始完整的描述文件位置的路径就是绝对路径；所谓相对路径，顾名思义就是当前文件相对与目标位置 如上图所示，如果从windows操作系统中访问admin.js，那么绝对路径方式找到admin.js文件应该是 D:\workspace\MVC\WebContext\js\admi
JS中的script标签
最新发布
2301_76662406的博客
09-08 538
浏览器在解析这个资源时，会向 src 属性指定的路径发送一个 GET 请求，以取得相应资源，假定 是一个 JavaScript 文件。这个初始的请求不受浏览器同源策略限制，但返回并被执行的 JavaScript 则受限制。 当然，这个请求仍然受父页面 HTTP/HTTPS 协议的限制。
【JS问题】require相对路径引入模块
曲江涛的博客
06-26 488
在ES6及以后版本中，推荐使用const和let来代替var，因为它们提供了块级作用域，可以减少很多由作用域引起的潜在问题。1、使用绝对路径：通过path.resolve和__dirname组合使用，构造了绝对路径，这样即使文件位置发生变化，也可以确保模块被正确加载。使用绝对路径：考虑使用Node.js的path模块或使用__dirname来构造绝对路径，这样可以避免因文件位置变动导致的路径错误问题。改善变量命名：使用更具描述性的变量名，例如paramService，这样可以提高代码的可读性。
HTML/JSP引入JS文件路径问题解析
z4331016的博客
01-24 8915
文档目录结构     可以看到我的测试test6.html页面与我的js文件所在的myUtils文件夹在同一个目录。 代码清单1-1 arraysUtils.js var arrays={};//定义数组对象 //复制数组方法,将a复制给b arrays.copyArrays=function(a,b){ for(var i=0;i b[i]=a[i]; }} 此时引
jsp、css中引入外部资源相对路径问题分析
10-24
综上所述，在JSP页面中引入外部资源时，正确设置和使用base URL是解决相对路径问题的关键。通过动态获取页面的上下文路径信息，并在适当的位置插入base标签，可以大大简化资源引用路径的管理，避免因路径错误导致...
jsp 网站引入外部css或者js失效问题解决
11-28
总结一下，解决JSP引入外部CSS和JS失效问题的关键在于： 1. 确保引用路径的正确性，可以使用`request`对象获取上下文路径来构建完整路径。 2. 如果使用了过滤器，需要在过滤器配置中排除静态资源的请求，以免误拦。...
CSS与JS中的相对路径引用简单介绍
09-25
相对于绝对路径，相对路径具有灵活性和简洁性的优点，但其引用基准在CSS和JavaScript中是不同的。下面详细介绍这两个方面： ### CSS中的相对路径引用 当我们在CSS文件中使用相对路径时，路径的基准是当前CSS文件...
在jsp文件中和js文件中引入图片的方法
王小坏费了很多时间整理的东西
10-08 2021
project的目录结构如下： 在jsp文件中插入图片的代码为 在js文件中插入图片的代码为Ext.form.Field.prototype.msgTarget="qtip"; var pic = new Ext.Component({ width: 400, //图片宽度 height: 80, //图片高度 autoEl: {
JSP页面中JS，图片等相对路径引用问题
大晨技术BLOG
09-01 4786
<br />这段时间时间碰到一个JS，图片等在JS中相对路径引用无效的问题，很是困恼，后来解决啦，主要还是路径问题。<br /> <br /> <br />直接说问题解决过程吧：<br /> <br />1. 使用httpwatch之类的看一下其中的图片或者JS指向的路径。<br /> <br />2. 看指向的路径有没有问题。<br /> <br />这次的问题是在使用了Spring的映射文件映射时，把页面的地址映射到了别的目录，例如：<br /> <br />页面原来的地址是：/home/web/***
相对路径和绝对路径的区别以及js和css引入相对路径的区别
Mia_shaungchen的博客
07-11 4065
1.绝对路径     绝对路径是指文件在硬盘上真正存在的路径。例如“bg.jpg”这个图片是存放在硬盘的“E:\book\网页布局代码\第2章”目录下，那么 “bg.jpg”这个图片的绝对路径就是“E:\book\网页布\代码\第2章\bg.jpg"。那么如果要使用绝对路径指定网页的背景图片就应该使用 以下语句：       2.使用绝对路径的缺点    事实上，在网
JSP页面引入js文件失败
葡萄战车的博客
04-09 2150
1.相对路径引入js文件：（以上图文件位置为例） 以相对路径引入js，只能是在js 和jsp 都在webroot 下的时候。当jsp跨越web-inf去引入web-inf外 ，webroot下的js时，会出现一定的问题。WEB-INF是Java的WEB应用的安全目录。所谓安全就是客户端无法访问，只有服务端可以访问的目录。引入代码如下： <script src="../js/xxx.js"&g...
得到Js文件的绝对路径或相对路径的两法
热门推荐
雨忆BLOG
06-06 2万+
方法一:/** * 全局函数 * 得到给定Js文件的绝对路径 * 可通过这个绝对路径在js文件中引用相对它的其它文件路径 * c:/aa.html,(在此文件中引入aa.js:) * c:/aa.js * c:/bb/ * c:/bb/cc.js * 如在aa.html中使用getPath("aa.js") + "../bb/cc.js",这样便是指向到与aa.js同级的目录bb下的cc.js
jsp中引用js的路劲的三种方式
xukangone的博客
11-07 1327
第一种 直接引用 这里的路劲为 <script type="text/javascript" src="js/jquery-3.0.0.min.js"></script> 注意：在jsp中使用js中的方式必须先对“jQuery-3.0.0.min.js”进行页面的引用，否则无效；因在js中使用$(document).ready()的时候依赖这个js文件。 第二...
JSP引入JS/CSS路径到底怎么写才好
诺浅的专栏
05-08 5635
如何在JSP页面引入一个JS或者CSS 以下所有的例子中的页面我们设定为a.jsp 方案一，错误的使用相对路径或绝对路径引入 相对路径 <script type="text/javascript" src="js/doctorstation/jquery-1.12.4.min.js"></script> 或者 <script type="text/ja...
绝对路径 VS 相对路径
kungfu_panda的专栏
08-06 4373
一、基本概念 　　1、相对路径-顾名思义，相对路径就是相对于当前文件的路径。网页中一般表示路径使用这个方法。 2、绝对路径-绝对路径就是你的主页上的文件或目录在硬盘上真正的路径。绝对路径就是你的主页上的文件或目录在硬盘上真正的路径，比如，你的Perl 程序是存放在 c:/apache/cgi-bin 下的，那么 c:/apache/cgi-bin就是cgi-bin目录的绝对路径 在网络
在JSP中引用JS文件的三种方法
a3060858469的博客
03-20 2万+
1、如果是直接访问JSP，则使用相对于JSP页面的相对路径：当项目目录如图所示时，则在NewFile.jsp中访问jquery-1.9.1.min.js的方法为： <script type="text/javascript" src="../scripts/jquery-1.9.1.min.js"></script>2、如果是从action跳转至JSP，则使用相对于WEB工程的相对路径： 如果是
Java Web中路径问题详解：相对路径与绝对路径
路径分为两种主要类型：相对路径和绝对路径。 1. **相对路径与绝对路径的区别** - **绝对路径**：是指完全描述一个文件或资源在系统中的位置的路径。它从根目录开始，例如`http://www.sun.com/index.htm`或`C:\xyz...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值