1. 程式人生 > >Web 頁中的JavaScript相對路徑

Web 頁中的JavaScript相對路徑

Web應用中的Web頁面常使用相對路徑來進行服務端的訪問,然而,不同的瀏覽器對相對路徑的解析存在差異。

應用場景:

假設有如下目錄:

|--upload

    |--controller

       |--upload.js

    |--upload.jsp

|--data

    |--list.txt

upload目錄下有upload.jsp頁面檔案和一個controller資料夾,controller中包含upload.js指令碼檔案,Web頁面upload.jsp使用了upload.js指令碼檔案。

data目錄為資料目錄,包含一個list.txt資料檔案。

現在要在upload.js中訪問data下的list.txt檔案。

處理:

1、IE

相對路徑以當前頁面作為基準。

訪問相對路徑:../data/list.txt

2、Firefox、Chrome

相對路徑以當前JS所在路徑作為基準。

訪問相對路徑:../../data/list.txt

可以看到,要是實現正確地訪問,在Firefox和Chrome瀏覽器中,需要多加一層向上的訪問目錄“../”。

實際應用中,可以針對不同的瀏覽器進行差異化處理:

 //其他瀏覽器對相對路徑的解析不同,IE預設頁面路徑為當前路徑,Chrome和Firefox以本JS檔案為當前路徑
 var url = the_server_uri;
 var explorer = navigator.userAgent;
 if (explorer.indexOf("MSIE") < 0) {
     url = "../" + url;
 }