相對路徑./與../區別

1、基本概念

一、相對路徑-顧名思義，相對路徑就是相對於當前文件的路徑。網頁中通常表示路徑使用這個方法。

二、絕對路徑-絕對路徑就是你的主頁上的文件或目錄在硬盤上真正的路徑。絕對路徑就是你的主頁上的文件或目錄在硬盤上真正的路徑，好比，你的Perl 程序是存放在 c:/apache/cgi-bin 下的，那麼 c:/apache/cgi-bin就是cgi-bin目錄的絕對路徑

在網絡中，以http開頭的連接都是絕對路徑，絕對路徑就是你的主頁上的文件或目錄在硬盤上真正的路徑，絕對路徑通常在CGI程序的路徑配置中常常用到，而在製做網頁中實際不多用到。

 

2、相對路徑使用的特殊符號

如下爲創建路徑所使用的幾個特殊符號，及其所表明的意義。

"./"：表明目前所在的目錄。

"../"：表明上一層目錄。

以"/"開頭：表明根目錄。

 

根目錄下有Site1和Image/Image.jpg，Site1下有Page1.html文件和Site2文件夾。Site2下有Page2.html和Page2Image.jpg圖片文件。

一、文件在當前目錄

         Page2.html訪問Page2Image.jpg

         <img src=」./Page2Image.jpg」>或者<img src=」Page2Image. jpg」>

 

   二、文件在上一層目錄

              Page1.html訪問Image下的Image.jpg

              <img src=」../Image/Image.jpg」>

              Page2.html訪問Image下的Image.jpg

              <img src=」../../Image/Image.jpg」>

 

三、文件在下一層目錄

         Page1.html訪問Site2文件夾下的Page2Image.jpg

              <img src=」 ./Site2/Image.jpg」><img src=」 Site2/Image.jpg」>

 

 四、根目錄表示法,任何頁面訪問Image下的Image.jpg圖片

              <img src=」/Image/Image.jpg」>

 

3、常使用且要注意的地方

 

A、Css中的圖片路徑。寫css裏的圖片路徑，url是圖片針對樣式文件的位置

 

-- index.html

-- css   /main.css

-- images/1.jpg

 

若是： index.html引用main.css，且在main.css 引用images目錄裏的1.jpg ：

      background: url(../images/1.jpg)  *** 正確

background: url(images/1.jpg)    *** 錯誤

B、Js中圖片地址均相對於調用JS的頁面的相對位置。

document.getElementById("IMG1").style.backgroundImage

= "url(../Images/login.jpg)";

 

4、優缺點及使用的地方

一、絕對路徑的優勢

    A、若是有人抄襲你的網站內容，裏面的連接還會指向你的網站，有些抄襲的人比較懶，根本不會去改內容。其實也不侷限於被抄襲，若是有人將你的網頁保存到本地電腦中，裏面的連接、圖片、css、以及js仍然會鏈接到你的網站。

    B、若是網頁位置改變，裏面的連接仍是指向正確的URL。

二、絕對路徑的缺點：

    A、在編碼編寫時不方便使用絕對路徑，由於連接應該指向真正的域名而不是開發站點。

 

相對路徑的優缺點和絕對路徑幾乎相反。

三、相對路徑的優勢：

    A、容易移動內容，能夠整個目錄移動。

    B、測試方法比較靈活，本機測試時比較方便。

 

四、相對路徑的缺點：

    A、部份內容頁面換了位置時，連接容易失效。

    B、容易被人大面積採集抄襲。