快捷導(dǎo)航

JS實現(xiàn)頁面跳轉(zhuǎn)鏈接的幾種方式匯總

更新時間：2024年01月09日 14:45:43 作者：viceen

這篇文章主要介紹了JS實現(xiàn)頁面跳轉(zhuǎn)鏈接的幾種方式,簡單總結(jié)了幾種頁面跳轉(zhuǎn)功能的實現(xiàn),有使用js跳轉(zhuǎn)頁面,返回上一次預(yù)覽界面及button按鈕添加事件跳轉(zhuǎn),本文結(jié)合實例代碼給大家介紹的非常詳細,需要的朋友參考下吧

js實現(xiàn)頁面跳轉(zhuǎn)鏈接的幾種方式

1、在當(dāng)前窗口打開

window.location. rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  
// 等價于    
<a  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_self">跳轉(zhuǎn)到百度</a>

2、在新窗口打開

window.open("http://www.baidu.com")  
// 等價于 
<a  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  target="_blank">跳轉(zhuǎn)到百度</a>

3、返回上一頁

window.history.back(-1)

4、跳轉(zhuǎn)鏈接

self.location. rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"

self 指代當(dāng)前窗口對象，屬于window 最上層的對象。

location.href   // 指的是某window對象的url的地址
self.location.href   // 指當(dāng)前窗口的url地址，去掉self默認為當(dāng)前窗口的url地址，一般用于防止外部的引用
top.location.href   // 為引用test.html頁面url的父窗口對象的url

如果你的網(wǎng)頁地址是:http://www.a.com，別人的是http://www.b.com, 他在他的頁面用iframe等框架引用你的http://www.a.com,那么你可以用:

if(top.location.href!=self.location.href){
       location. rel="external nofollow" ;
}

來轉(zhuǎn)向你的頁面,top指代的是主體窗口,這里top.location.href返回http://www.b.com;

下面簡單總結(jié)了幾種頁面跳轉(zhuǎn)功能的實現(xiàn)

第一種：使用JS跳轉(zhuǎn)頁面

1）跳轉(zhuǎn)帶參

<script language="javascript" type="text/javascript">
       window.location. rel="external nofollow"  + window.location.href; 
</script>

2）跳轉(zhuǎn)無參

<script>window.location.;</script>

第二種：返回上一次預(yù)覽界面

<script language="javascript">
	alert("返回");
	window.history.back(-1);
</script>

HTML頁面嵌套

<a href="javascript:history.go(-1)" rel="external nofollow" >返回上一步</a>
<a href="<%=Request.ServerVariables(" rel="external nofollow" HTTP_REFERER")%>">返回上一步</a>

第三種：button按鈕添加事件跳轉(zhuǎn)

<input name="前端知音" type="button" value="前端知音" onClick="location.href='login.do'">

第四種：在新窗口打開

<a href="javascript:" rel="external nofollow"  onClick="window.open('login.do','','height=500,width=611,scrollbars=yes,status=yes')">新窗口</a>

第五種：通過meta設(shè)置跳轉(zhuǎn)頁面

<head>
    <!--只刷新不跳轉(zhuǎn) -->
    <meta http-equiv="refresh" content="5">
    <!--定時跳轉(zhuǎn) -->
    <meta http-equiv="refresh" content="5;url=index.html"> 
</head>

到此這篇關(guān)于JS實現(xiàn)頁面跳轉(zhuǎn)鏈接的幾種方式的文章就介紹到這了,更多相關(guān)js頁面跳轉(zhuǎn)鏈接內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！