JavaScript与CSS相对路径引用的差异
Posted 牛B思密达
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript与CSS相对路径引用的差异相关的知识，希望对你有一定的参考价值。
转自：http://blog.csdn.net/luohuidong01/article/details/74938652
JS跟CSS相对路径引用的差异在于他们的参考点不一样，下面举个例子说明一下。
文件目录如下
|—— css | |__ myStyle.css |—— script | |__ myScript.js |—— images | |__ myImage.jpg |—— index.html
HTML代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="css/myStyle.css">
</head>
<body>
<div>示例文字</div>
<img src="" >
</body>
</html>
<script src="script/myScript.js"></script>
我们利用CSS将myImage.jpg作为div元素的背景图片
div {
width: 300px;
height: 300px;
background: url(‘../images/check.png‘);
}
我们再利用JS将img元素更改为显示myImage.jpg
window.onload = initPage;
function initPage() {
var imgs = document.getElementsByTagName("img");
imgs[0].src = "images/check.png";
}
请注意看一下CSS跟JS中的相对引用路径。
css中的相对引用路径，是以CSS文件自身作为参考的基准点来写。
而JS的相对引用路径，确是以使用这个外部JS文件的HTML文件的位置作为参考的基准点。
以上是关于JavaScript与CSS相对路径引用的差异的主要内容，如果未能解决你的问题，请参考以下文章