html和js中的相对url问题（js和css 中相对url）

来源：互联网发布：李建利知乎编辑：程序博客网时间：2024/06/08 20:03

两个页面a.html和b.html:
页面a.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="js/jquery.min.js"></script> <script src="js/test.js"></script> </head> <body> 我是aaaaaaaa </body> </html>
页面a.html

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>    </head>    <body>        我是bbbbbbbbb    </body></html>

test.js

$.ajax({        type:"get",        url:"b.html",        async:true,        success:function(data) {            console.log(data);            console.log(window.location.href);        }    });

三个文件的位置信息：
这里写图片描述

test.js中的请求url是a.html请求的url（http://127.0.0.1:8020/relation/a.html）为基准的相对路径，并不是test.js请求的url（http://127.0.0.1:8020/relation/js/test.js）为基准的相对路径；

总结：
（1）相对路径：
html中引用的js文件中的各种相对路径是以html的url为基准路径

在css中出现的相对路径，是以css文件所在路径为基准的，而js中的路径则是以导入此js的网页文件所在的位置为基准的。

CSS、JS中的相对路径引用链接http://www.cnblogs.com/xuxiace/archive/2012/03/06/2381874.html

（2）绝对路径：
html中完整的绝对路径没有任何问题，但是如果是通过“/”的绝对路径，例如

<script src="/js/test.js"></script>

发送请求时会加上前缀，前缀只能够找到ip和端口，无法定位到项目名称，所以这样写地址时要特别注意，要这样写：

<script src="/项目名称/js/test.js"></script>

但是如果是在服务器上就没有这种问题，因为在服务器上“/”，这样的路径的前缀自带项目名称；

阅读全文

0 0