頁面跳轉(zhuǎn)實(shí)現(xiàn)方法:location.href:分配新 url 直接跳轉(zhuǎn)。window.location:控制頁面 url 和跳轉(zhuǎn),如 assign、replace、reload。window.open:在新窗口或選項(xiàng)卡中打開頁面。document.location:與 window.location 類似,適用于當(dāng)前文檔關(guān)聯(lián)頁面。
JS 頁面跳轉(zhuǎn)如何實(shí)現(xiàn)
JavaScript 提供了多種方式實(shí)現(xiàn)頁面跳轉(zhuǎn),具體取決于需要跳轉(zhuǎn)的頁面和跳轉(zhuǎn)的類型。以下是一些常用的方法:
1. location.href
此屬性表示當(dāng)前頁面的 URL。通過將新的 URL 分配給此屬性,可以跳轉(zhuǎn)到另一個(gè)頁面。例如:
location.href = "https://example.com/";
登錄后復(fù)制
2. window.location
window.location 對(duì)象提供了對(duì)當(dāng)前頁面 URL 和其他信息的控制。可以用以下方式進(jìn)行頁面跳轉(zhuǎn):
window.location.assign(“https://example.com/”) – 將新 URL 分配給當(dāng)前頁面,但不更改歷史記錄。
window.location.replace(“https://example.com/”) – 替換當(dāng)前頁面的歷史記錄中當(dāng)前 URL,并加載新頁面。
window.location.reload() – 重新加載當(dāng)前頁面。
3. window.open
此方法允許在新的窗口或選項(xiàng)卡中打開頁面。語法如下:
window.open("https://example.com/", "_blank");
登錄后復(fù)制
使用 “_blank” 參數(shù)將在新的選項(xiàng)卡中打開頁面,而 “_self” 將在當(dāng)前窗口中打開頁面。
4. document.location
document.location 屬性與 window.location 類似,但僅適用于與當(dāng)前文檔關(guān)聯(lián)的頁面。它可以通過以下方式進(jìn)行頁面跳轉(zhuǎn):
document.location = "https://example.com/";
登錄后復(fù)制
選擇合適的方法
選擇哪種頁面跳轉(zhuǎn)方法取決于具體情況。當(dāng)需要立即跳轉(zhuǎn)到新頁面并清除歷史記錄時(shí),window.location.replace() 是一種有用的選擇。如果需要在新的選項(xiàng)卡中打開頁面,則 window.open 是合適的選項(xiàng)。對(duì)于簡(jiǎn)單的頁面跳轉(zhuǎn),location.href 可以很好地完成工作。