一、概述
無論是做網頁，還是WEB系統，我們都會用到鏈接，圖片，文件的地方，這些地方都涉及到路徑的問題，例如：background-image:url();這一CSS樣式，而url()的定義方式有兩種，一種是絕對路徑，一種是相對路徑，我們平時在寫網頁用到最多的是相對路徑，這篇文章主要介紹的是絕對路徑和相對路徑在項目中的應用，這里有人會說相對路徑更利於項目的移植和部署，那么我們為什么還要用到絕對路徑呢？以下做簡要介紹與分析：
二、什么是絕對路徑：
絕對路徑是指文件在硬盤上真正存儲的路徑。比如我們在D盤里的images文件夾下存了一張圖片logo.png，那么這個圖片的絕對路徑就是D:\images\logo.png。所以我們在使用絕對路徑指向該圖片的時候的語句應該為：
background-image:url("D:\images\logo.png");
在我們實際編程中我們很少會用到絕對路徑，因為本地電腦上的圖片的當前位置，很可能在傳輸到WEB服務器上發生改變，舉個簡單的例子，假如你得項目文件夾在本地C盤，此時你定義了一個背景圖的路徑，C:\demo\images\logo.png，此時你把項目整體移動到D盤此時該圖片的真正路徑為D:demo\images\logo.png，而根據原路徑是找不到的。
三、什么是相對路徑：
相對路徑是指，相對於本文件的目標文件的位置。相對路徑可以避免在項目整體目錄改變時，絕對路徑找不到的問題。相對路徑有以下幾種情況：
(1)本文件與目標文件在同一根目錄下，例如：demo.html與logo.png在同一目錄下：
這時指向logo的相對路徑為：background-image:url(logo.png);
(2)本文件與目標文件的上級目錄在同一根目錄下，例如demo與image在同一目錄下，logo在image文件夾內：
這時指向logo的相對路徑為：background-image:url(image/logo.png);
(3)本文件的上級目錄與目標文件的上級目錄在同一根目錄下，例如：demo.html在html文件夾下，logo在image下：
這時指向logo的相對路徑為：background-image:url(../image/logo.png); 這里的../是指向上一級目錄，如果你的本文件在第2層目錄下用../../去找，依次類推在n層就用n個../。
四、絕對路徑與相對路徑的優缺點及使用的地方
1、絕對路徑的優點：
如果網頁位置改變，里面的鏈接還是指向正確的URL。
2、絕對路徑的缺點：
在編碼編寫時不方便使用絕對路徑，因為鏈接應該指向真正的域名而不是開發站點。
3、相對路徑的優點：
A、容易移動內容，可以整個目錄移動。
B、測試方法比較靈活，本機測試時比較方便。
4、相對路徑的缺點：
A、部分內容頁面換了位置時，鏈接容易失效。
B、容易被人大面積采集抄襲。
結合實際情況，我在項目進行的過程中，分別編寫了兩個提示頁面，一個是無權限訪問頁，一個是未登錄或登錄超時頁面，這兩個頁面的跳轉地址不固定，尤其是無權限訪問頁，跳轉地址變化非常大，網頁內圖片不能顯示，這時就需要用到絕對路徑了，但是為了項目的正常運行絕對路徑不能寫死（這里有的人叫做相對虛擬目錄，其實就是絕對路徑的原理），我用JS取值：
//獲取項目路徑 var contextPath = "${pageContext.request.contextPath}"; // 將 項目路徑 與 相對虛擬目錄 拼接成絕對路徑 var url = contextPath + "/images/logo.jpg"; //給元素URL賦值 $("元素").css("background-image","url(" + url + ")");
這樣無論我們項目部署在哪或者是訪問地址如何改變，訪問路徑都能正確的指向我們想要的url，解決了我們所說的項目移植等問題。