JavaScript location Object

JavaScript 的 location 物件讓你可以存取瀏覽器頁面的網址 (URL) 相關資訊。

location 物件內建提供很多不同的屬性 (properties) 和方法 (methods)。

取得當前網頁的網址 (URL) location.href

location.href 屬性用來讓你取得當前網頁的網址：

// "http://www.fooish.com/javascript/location.html"
location.href;

location.hostname 屬性用來讓你取得當前網頁的網域名稱 (domain name; host name)：

// "www.fooish.com"
location.hostname;

location.pathname 屬性用來讓你取得當前網頁的網址路徑：

// "/javascript/location.html"
location.pathname;

location.search 屬性用來讓你取得當前網頁網址上的參數 (GET parameters)：

// 假設使用者所在的網頁網址為
// http://www.fooish.com/javascript/location.html?foo=hello&bar=101

// 會得到 "?foo=hello&bar=101"
location.search;

如果沒有網址參數則會返回空字串。注意返回的參數包含問號 ?。

location.search 不僅可以用來讀取，還可以用來改變網址參數（會重新載入新網頁）。

location.hash 屬性用來讓你取得當前網頁網址上的 hash 值：

// 假設使用者所在的網頁網址為
// http://www.fooish.com/javascript/location.html#foo

// 會得到 "#foo"
location.hash;

如果網址中沒有 hash 則會返回空字串。注意返回的 hash 包含井字號 #。

location.hash 不僅可以用來讀取，還可以用來改變網址 hash 值（不會重新載入網頁）。

location 物件還可以用來將目前網頁轉換到另一個網址，或重新整理當前的網頁。

前面提到的 location.href 除了可以用來取得當前網址，還可以用來將網頁切換到新的網址：

// 切到同一個網站，不同的路徑
location.href = '/jquery/';

// 切換到另一個網站
location.href = 'https://www.google.com/';

location.assign() 方法跟 location.href 用途類似，可以在當前視窗載入一個新的網頁。

語法：

location.assign(url);

用法：

location.assign('http://www.fooish.com/');

Location.reload() 方法可以用來重新整理網頁。

語法：

location.reload(forcedReload);

參數 forcedReload 是一個布林值 (boolean)，如果是 true 用來強制瀏覽器從 server 取得最新的資料；預設是 false，會優先從瀏覽器暫存檔 (cache) 中取得網頁資料。

用法：

location.reload(true);

location.replace() 方法也是用來在當前視窗載入一個新的網頁，但和 location.assign() 的差別在於，使用 location.replace() 當前網頁的瀏覽紀錄 (History) 會被新的網頁取代掉，也就是讓使用者沒辦法按「上一頁」回去。

語法：

location.replace(url);

用法：

location.replace('http://www.fooish.com/');