快捷導(dǎo)航

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

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

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

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

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

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

2、在新窗口打開(kāi)

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

3、返回上一頁(yè)

window.history.back(-1)

4、跳轉(zhuǎn)鏈接

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

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

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

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

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

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

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

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

1）跳轉(zhuǎn)帶參

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

2）跳轉(zhuǎn)無(wú)參

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

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

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

HTML頁(yè)面嵌套

<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'">

第四種：在新窗口打開(kāi)

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

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

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

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