網頁開發中的文件相對路徑

        一般來說,如果需要引用當前網站外部的文檔和素材,我們應該使用絕對路徑;而在引用當前網站內部的文檔和素材時,我們應該使用相對路徑。由於相對路徑中不包含網站地址等信息,從而使得網站更容易移植(例如,更換網站域名),因此,雖然也可以使用絕對路徑鏈接同一網站內的文檔,但應該儘量使用相對路徑。 一般來說,在製作內部鏈接時,我們應該儘量使用文檔相對路徑,而不是根相對路徑,這樣做的原因是在本地預覽網站時,瀏覽器並不承認當前站點的根目錄爲服務器,因此會導致鏈接錯誤的情況,使用文檔相對路徑則沒有這樣的問題。 但在某些情況下,使用根相對路徑是更好的選擇,如果在版權信息中引用了一個站內素材(例如自定義文件下的一張圖片),由於版權信息的代碼同時爲多個不同目錄下的網頁所使用(例如,同時被首頁和一級頁面所使用),由於這些網頁的所在目錄不同,無法使用文檔相對路徑,此時,使用根相對路徑則可以得到正確的結果(當然,這個“正確”是指在上傳後的網站內是正確的)。

        在網頁中書寫相對路徑:使用被引用文檔或素材相對於當前頁面的相對路徑,例如,在網 頁“/home/www/a/index.htm”引用素材“/home/www/a/images/a.jpg”,其相對路徑應該“./images/a.jpg”或“images/a.jpg”。


        在JS文件中書寫相對路徑:JS文件是指在頁面中引用的外部JavaScript文件,其中可能採用JavaScript代碼生成html代碼,由於生成的html代碼是嵌入在引用該JS文件的頁面中,因此,在描述相對路徑時,應該使用被引用的文檔或素材相對於引用JS文件的頁面之間的相對路徑。例如,文檔“/home/www/a/index.htm”中引用了JS文件“/home/www/a/js/hello.js”,而在該js中生成一段引用素材“/home/www/a/images/1.jpg”的html代碼,則在這段代碼中,其相對路徑應該是“./images/1.jpg”或“images/1.jpg”,而不能是“../images/1.jpg”。


         在CSS文件中書寫相對路徑:CSS文件是指在頁面中引用的外部樣式定義文件,該文件通常用於定義頁面中各種html標記的顯示效果(例如文本的字體名稱、字體大小、縮進、邊距等),CSS文件中同樣可以引用外部的素材或文檔(例如設置某個DIV對象的背景圖片)。和JS文件不同,瀏覽器認爲CSS文件也是一個獨立的文檔,因此,在CSS中對素材的引用可以通過計算素材文件和該CSS文件之間的相對路徑來實現,而與引用該CSS文件的頁面所在的位置無關。例如,文檔“/home/www/a/index.htm”中引用了CSS文件“/home/www/a/css/main.css”,而在該CSS中引用了素材“/home/www/a/images/1.jpg”,則在CSS中對於該素材引用的相對路徑應該是“../images/1.jpg”,而不能是“./images/1.jpg”或“images/1.jpg”。
發佈了79 篇原創文章 · 獲贊 16 · 訪問量 59萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章