CSS、JS中的相对路径引用的区别_css的相对路径.的区别-CSDN博客

本文链接：https://blog.csdn.net/qq_26222859/article/details/51417169

大家在html中通常会导入一些外部的css、js文件，其中一个比较容易被忽视的问题就是路径问题，有时候，我们在css、js中都有通过路径来引入一张图片的需求，当我们采用相对路径的时候，在css和js中引用图片的相对路径的基准是不一样的。在css中出现的相对路径，是以css文件所在路径为基准的，而js中的路径则是以导入此js的网页文件所在的位置为基准的。

网上有很多文章都描述了这个问题，大家也可以百度搜索。

本人在编写ajax验证的时候发现这个问题

1.php是后台处理ajax验证的文件

如下，index.php引用check.js，是他的宿主文件

<html>  
<title>php+jquery+ajax+json简单小例子</title>  
<?php  
header("Content-Type:text/html;charset=utf-8");  
?>  
<head>  

<script src="js/jquery-1.12.3.js"></script>
<script type="text/javascript" src="js/check.js">

check.js如下，url路径应该写成1.php相对于index.php的路径，即ajax/1.php，而不是1.php相对于check.js的路径../ajax/1.php

$(function() {  
$("#subbtn").click(function() {  
var params = $("input").serialize();  
var url = "ajax/1.php";  
$.ajax({  
type: "post",  
url: url,  
dataType: "json",  
data: params,  
success: function(msg){  
var backdata = "您提交的姓名为：" + msg.name +  
"<br /> 您提交的密码为：" + msg.password;  
$("#backdata").html(backdata);  
$("#backdata").css({color: "green"});  
}  
});  
});  
  
});