JavaScript與CSS相對路徑引用的差異
阿新 • • 發佈：2019-02-15
JS跟CSS相對路徑引用的差異在於他們的參考點不一樣，下面舉個例子說明一下。
檔案目錄如下
|—— css
| |__ myStyle.css
|—— script
| |__ myScript.js
|—— images
| |__ myImage.jpg
|—— index.htmlHTML程式碼如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link 我們利用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檔案的位置作為參考的基準點。