css和javascript圖片路徑的不同

今天敲程式碼時，想寫一個切換頭像的功能，問題來了，頭像就是死活不出現吶。突然靈光一現，css和javascript圖片路徑書寫方式不一樣？ ？ ？

嗯…是這樣的:

在根目錄下新建了個「images」文件，裡面放了兩張圖片bg1.png和bg2.png

在根目錄下另外新建了兩個文件夾"style "和"script"用來存放用到的.css檔案和.js檔案

index.html中有

<div id="pic">
<p>开心吗</p>
</div>

如果這時我要設定id為pic的標籤的圖片背景,在css檔案裡這樣寫:

#pic{ background:url(../images/bg1.png); }

而在js檔案中則要將路徑寫做images/bg1.png

總之，

(1)對於js腳本,html是吧腳本加載到頁面中一起解析(就跟你的js腳本直接寫在這個頁面是一樣的)

(2)而對css文件,則僅僅是提供一個連接,並不會將其加載到html頁面中,如在本例中,html根據鏈接去css文件中尋找所需要的圖片檔。

css的圖片檔案路徑是相對於自己的，js的圖片檔案路徑是相對於所在檔案的。