特殊的window

提起window，在網(wǎng)頁當(dāng)中很常見，比如像這樣：

window.onload=function(){ //執(zhí)行函數(shù)體 }

這段代碼的意思是當(dāng)網(wǎng)頁內(nèi)容加載完成后要做什么。

在js的領(lǐng)域，window對(duì)象有著雙重角色，既是用來訪問瀏覽器窗口的接口，又是Global對(duì)象。

也正因?yàn)榇?#xff0c;所有全局作用域中聲明的變量、函數(shù)都會(huì)變成window對(duì)象的屬性和方法。

比如這樣：

var age = 29; function sayAge(){alert(this.age); } alert(window.age); //29 sayAge(); //29 window.sayAge(); //29

但二者也不是完全等同，全局變量不能通過delete刪除，而直接在window上定義的屬性可以。

歷史遺留

早期的網(wǎng)頁中會(huì)使用較多的窗口和框架，在同一個(gè)窗口內(nèi)展示有嵌套形式的網(wǎng)頁，以及各種彈窗alert、confirm、prompt等，給用戶輸入或者確認(rèn)信息，但隨著網(wǎng)頁開發(fā)技術(shù)和設(shè)計(jì)的發(fā)展，它們已經(jīng)難尋蹤跡，所以這里不重點(diǎn)說。

location對(duì)象

基本屬性

location是最有用的BOM對(duì)象之一，它提供了當(dāng)前窗口所加載文檔的信息和導(dǎo)航功能。它的主要用途都跟url有關(guān)：

• hash：返回url中#符號(hào)后面的字符，如果沒有，返回空。
• host/hostname：返回服務(wù)器名稱或者端口號(hào)之類。
• href：返回完整url
• port：返回指定端口號(hào)
• protocol：返回使用的協(xié)議
• search：返回url的查詢字符串，即從問號(hào)開始到末尾的所有內(nèi)容

位置操作

location可以通過多種方式改變?yōu)g覽器的位置，最常用的是assign()方法，比如：

location.assign("http://www.baidu.com");

這樣就會(huì)馬上打開新的url，并在瀏覽歷史中增加一條記錄，下面兩行代碼等效：

window.location = "http://www.baidu.com"; location.href = "http://www.baidu.com";

最常見的是location.href。

當(dāng)然，修改其他屬性也可以改變當(dāng)前加載的頁面，通過任何一種方式修改url之后，都會(huì)有一條新記錄生成，用戶可以通過點(diǎn)擊后退按鈕導(dǎo)航到前一個(gè)頁面，不過，有時(shí)候我們不希望這種操作發(fā)生，可以使用replace()方法。像下面這樣：

location.replace("http://www.baidu.com");

它只接收一個(gè)參數(shù)，即導(dǎo)航到的url，且不會(huì)生成記錄，用戶不能返回前一個(gè)頁面。

與位置有關(guān)的另一個(gè)方法是reload()，作用就是它的字面意思，重新加載當(dāng)前頁，但這里有一點(diǎn)點(diǎn)小講究，如果僅僅是reload，不帶參數(shù)，頁面會(huì)從瀏覽器緩存中重新加載，如果強(qiáng)制從服務(wù)器重新加載，則需要傳遞參數(shù)，像這樣：

location.reload(true);

history對(duì)象

history保留著用戶上網(wǎng)的記錄，每個(gè)瀏覽器窗口、標(biāo)簽頁，都有自己的history對(duì)象與特定的window對(duì)象相關(guān)聯(lián),出于安全考慮，開發(fā)人員一般無法得知用戶瀏覽過哪些網(wǎng)頁，但仍然有辦法實(shí)現(xiàn)前進(jìn)后退功能，方法就是go()。例如這樣：

history.go(-1); history.go(1);

其參數(shù)不僅是數(shù)字，也可以是一個(gè)字符串，瀏覽器會(huì)跳到歷史記錄中包含該字符串的第一個(gè)位置，可以是前進(jìn)，也可能是后退。比如

history.go("baidu.com");

另外，前進(jìn)或者后退也有更直接一些的方法back()、forward()。

除此之外，history還有個(gè)length屬性，保存歷史記錄的數(shù)量，如果你想確定用戶是否一開始就打開了你的頁面，可以用到它。

if(history.length == 0){//干你想干的事 }

history對(duì)象不是特別常用，但在某些特殊用途的設(shè)計(jì)當(dāng)中，還是要請(qǐng)它出馬來搞定問題。

總結(jié)

window對(duì)象在移動(dòng)互聯(lián)網(wǎng)浪潮下的地位已經(jīng)不像PC端那么重，更多涉及的是功能和檢測(cè)方面，涉及交互較多，其他方面則交由功能更豐富的自定義的代碼來實(shí)現(xiàn)了。

盡管如此，window對(duì)象也不止這么簡(jiǎn)單，還有一個(gè)重要的navigator對(duì)象，但說到它內(nèi)容有有點(diǎn)多，后續(xù)單獨(dú)一篇文章跟大家分享。

歡迎交流！~

Window對(duì)象在前端領(lǐng)域的角色

歡迎關(guān)注我的公眾號(hào)：靈感周末

總結(jié)

以上是生活随笔為你收集整理的window location href 手机端无法跳转_Window对象在前端领域的角色的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。