location屬性解釋 - window.location & $location

window.location瀏覽器

全部瀏覽器都支持 window 對象。它表示瀏覽器窗口。全部 JavaScript 全局對象、函數以及變量均自動成爲 window 對象的成員。緩存

  • 全局變量是 window 對象的屬性
  • 全局函數是 window 對象的方法

window.location 對象用於得到當前頁面的地址 (URL)信息,並把瀏覽器重定向到新的頁面,通常在編寫時可不使用 window 這個前綴。服務器

屬性 描述
hash 設置或返回從#開始的 URL(錨)
host 設置或返回主機名和當前 URL 的端口號
hostname 設置或返回當前 URL 的主機名
href 設置或返回完整的 URL
pathname 設置或返回當前 URL 的路徑部分
port 設置或返回當前 URL 的端口號
protocol 設置或返回當前 URL 的協議
search 設置或返回從?開始的 URL(查詢部分)

 

對象方法 描述
assign() 加載新的文檔。
reload() 從新加載當前文檔。
replace() 用新的文檔替換當前文檔。

其餘 
ancestorOrigins:DOMStringList
toString() 
valueOf()
__proto__ :Object —— 原型鏈
函數

 

以這個URL爲例:http://www.baidu.com:80/demo/show?ver=1.0&id=6#imhereurl

  • href: "http://www.baidu.com:80/demo/show?ver=1.0&id=6#imhere"
  • protocol: "http:"
  • hostname: "www.baidu.com"
  • port: "80"
  • pathname: "/demo/show"
  • search: "?ver=1.0&id=6"
  • hash: "#imhere"
  • host: "www.baidu.com:80"               host = hostname + port
  • origin: "http://www.baidu.com:80"       origin = protocol + host

1.location.assign( url )
  location.assign('http://www.baidu.com'); 等同於 window.location = 'http://www.baidu.com'
  這種方式會講新地址放到瀏覽器歷史棧中,意味着轉到新頁面後「後退按鈕」仍能夠回到該頁面。
2.location.replace( url )
  與assign方法同樣,但會從瀏覽器歷史棧中刪除本頁面,或者說當使用該方法時,新的 URL 將覆蓋 History 對象中的當前記錄,也就是說跳轉到新頁面後「後退按鈕」不能回到該頁面。
3.location.reload( force ) 從新載入當前頁面spa

  默認值false,false則從瀏覽器緩存中重載。會用 HTTP 頭 If-Modified-Since 來檢測服務器上的文檔是否已改變。若是文檔已改變,reload() 會再次下載該文檔。若是文檔未改變,則該方法將從緩存中裝載文檔。這與用戶單擊瀏覽器的刷新按鈕的效果是徹底同樣的。對象

  force爲true時,以GET方式從服務器端重載,在http請求頭中不會包含緩存標記,由於不管文檔的最後修改日期是什麼,它都會繞過緩存,從服務器上從新下載該文檔。這與用戶在單擊瀏覽器的刷新按鈕時按住 Shift 鍵的效果是徹底同樣。(W3School)ip

 還有一種刷新頁面的方法: history.go(0)原型鏈

相關文章
相關標籤/搜索