Location對象經常使用知識

產品終於上線，後期主要是優化了。在開發過程當中用到了不少location對象的知識，趁如今有時間先整理一下。

---

 

Location 對象存儲在 Window 對象的 Location 屬性中，可經過window.location對其訪問，表示那個窗口中當前顯示的文檔的 Web 地址。它的 href 屬性存放的是文檔的完整 URL，其餘屬性則分別描述了 URL 的各個部分。

 

1、Location 對象屬性

屬性	描述
href	設置或返回完整的 URL。
host	設置或返回主機名和當前 URL 的端口號。
hash	設置或返回從井號 (#) 開始的 URL（錨）。若是地址裏沒有「#」，則返回空字符串。
hostname	設置或返回當前 URL 的主機名。
pathname	設置或返回當前 URL 的路徑部分。
port	設置或返回當前 URL 的端口號。
protocol	設置或返回當前 URL 的協議。取值爲 'http:','https:','file:' 等等。
search	設置或返回從問號 (?) 開始的 URL（查詢部分）。

 

 

 

 

 

 

 

 

 

 

 

 

 

使用實例：

（1）在利用ajax進行交互的時候，通常URL的域名部分是同樣的，因此一般會在common.js裏面定義一個常量。

若是ajax訪問的URL的域名和前端頁面訪問的域名是同樣的，這個時候就能夠利用location對象來動態獲取前端頁面訪問的域名以後，再來定義這個公共常量。以下：

（網址爲 ：http://demo.emmaclub.com/wechat/index，那麼window.location.host 獲取的爲 ：demo.emmaclub.com）

 

 （2）在開發過程當中，若是想要利用JavaScript代碼從當前頁跳轉到其餘頁面，能夠直接使用href屬性。

window.location.href = ''；

 

還有一種跳轉方法是使用location對象的replace()方法。

 上述代碼至關於：

 

（3）區分上述屬性：

 

 

2、Location 對象方法

 

reload()方法其實至關於刷新，而replace(URL)方法則是至關於a標籤跳轉。

 

 

---

 

 這裏順便提一下URL的組成。

3、URL的組成

URL是Uniform Resource Location的縮寫，譯爲「統一資源定位符」。通俗地說，URL是Internet上用來描述信息資源的字符串，主要用在各類WWW客戶程序和服務器程序上，特別是著名的Mosaic。採用URL能夠用一種統一的格式來描述各類信息資源，包括文件、服務器的地址和目錄等。

URL的格式URL的格式大概由下列三部分組成： 
第一部分是協議（或稱爲服務方式）； 
第二部分是存有該資源的主機IP地址（有時也包括端口號）； 
第三部分是主機資源的具體地址。，如目錄和文件名等。 
第一部分和第二部分之間用「：//」符號隔開，第二部分和第三部分用「/」符號隔開。第一部分和第二部分是不可缺乏的，第三部分有時能夠省略。 

 

就如下面這個URL爲例，介紹下普通URL的各部分組成：

http://www.aspxfans.com:8080/news/index.asp?boardID=5&ID=24618&page=1#name

從上面的URL能夠看出，一個完整的URL包括如下幾部分：
1.協議部分：該URL的協議部分爲「http：」，這表明網頁使用的是HTTP協議。在Internet中可使用多種協議，如HTTP，FTP等等本例中使用的是HTTP協議。在"HTTP"後面的「//」爲分隔符

2.域名部分：該URL的域名部分爲「www.aspxfans.com」。一個URL中，也可使用IP地址做爲域名使用

3.端口部分：跟在域名後面的是端口，域名和端口之間使用「:」做爲分隔符。端口不是一個URL必須的部分，若是省略端口部分，將採用默認端口

4.虛擬目錄部分：從域名後的第一個「/」開始到最後一個「/」爲止，是虛擬目錄部分。虛擬目錄也不是一個URL必須的部分。本例中的虛擬目錄是「/news/」

5.文件名部分：從域名後的最後一個「/」開始到「？」爲止，是文件名部分，若是沒有「?」,則是從域名後的最後一個「/」開始到「#」爲止，是文件部分，若是沒有「？」和「#」，那麼從域名後的最後一個「/」開始到結束，都是文件名部分。本例中的文件名是「index.asp」。文件名部分也不是一個URL必須的部分，若是省略該部分，則使用默認的文件名

6.錨部分：從「#」開始到最後，都是錨部分。本例中的錨部分是「name」。錨部分也不是一個URL必須的部分

7.參數部分：從「？」開始到「#」爲止之間的部分爲參數部分，又稱搜索部分、查詢部分。本例中的參數部分爲「boardID=5&ID=24618&page=1」。參數能夠容許有多個參數，參數與參數之間用「&」做爲分隔符。