JS实现页⾯跳转与刷新的⽅法汇总
window.location(.href)="URL"
其实 .href 可以省略
window.location 和window.location.href 实现的效果是⼀样的
例如：
window.location = "www.baidu"
window.location.href = www.baidu
上⾯两种⽅法都可以从当前页⾯跳转到⽬标页⾯
不同之处在于window.location 返回的是对象，如果没有.href，它会默认参数就是href
winodw.location.assign("URL")
这个⽅法和上⾯的⽅法差不多
⽤法：
winodw.location.assign(www.baidu)
place("URL")
如果⽤place("www.baidu") 实现跳转页⾯, 它和上⾯⽅法的区别在于它跳转后不会保存跳出页⾯的信息.所以如果使⽤ history 历史返回按钮是⽆效的
它的效果类似于在⽹页上点击右键, 在新窗⼝打开或新标签页打开.
⽽window.location.href 实现的效果是在页⾯上点击⽬标链接, 然后可以点击历史返回按钮, 返回到之前页⾯。
历史页跳转
下⾯的两种⽅法都可以实现返回历史页，相当于点了页⾯左上⾓的返回按钮
window.history.back();
(-1);
back和go⾥⾯都可以放数值
例如：⾥⾯放上 -1 意思就是返回上⼀级，⾥⾯放上 -2 就是返回上上级，以此类推
⽽且⾥⾯还可以放上指定的路由路径，⽐如('../routes/admin/'); 这样可以跳转到指定的路由模块
meta refresh
如果⽤户浏览器禁⽤了javascript, 那么可以⽤meta refresh来实现⾃动跳转:
<noscript>
<meta http-equiv="refresh" content="0;URL=www.baidu/">
</noscript>
如果要实现 JS ⾃动跳转，可以加个定时器：
setTimeout(function(){ ... }, 1000);
重新加载本页
如果你的代码逻辑执⾏完了，想要重新加载页⾯的话，可以⽤这两种⽅法：
load()
place()
这两种⽅法都可以重新加载本页，但是replace()可以导向另外⼀个URL
例如：place("www.baidu")
window.navigate('URL')
window.navigate('URL')这个⽅法是只针对IE的，不适⽤于⽕狐等其他浏览器，在HTML DOM Window Object中，根本没有列
出window.navigate这个⽅法，所以这个⽅法尽量少⽤，遗忘最好。
self、parent、this、top
top.location.href=”url” 在顶层页⾯打开url（跳出框架）
self.location.href=”url” 仅在本页⾯打开url地址
parent.location.href=”url” 在⽗窗⼝打开Url地址
this.location.href=”url” ⽤法和self的⽤法⼀致
if (top.location == self.location) 判断当前location是否为顶层来禁⽌frame引⽤，如果页⾯当中有⾃定义的frame的话，也可以将parent self top换为⾃定义frame的名称，效果就是在⾃定义frame窗⼝打开url。
⽰例：
if(top != self){
top.location.href = location.href;
} //禁⽌frame引⽤
以下是从⽹上到的⼀个例⼦，不是很直观，你可以加上上⾯那三⾏代码，可以先去掉，再加上，看⼀下效果，应该就清楚了
top.html代码
<script language=javascript>
function rs(){
if(top !== self){
top.location.href = location.href;js assign
}
parent.left.location.href="top.htm" ;
parent.bot.location.href="top.htm";
}
< /script>
< input type=button name=name value="ksdj" onclick=rs();>
test.html代码
<FRAMESET COLS="150,*">
< FRAME SRC="left.htm" name=left>
< FRAMESET ROWS="150,*">
< FRAME SRC="top.htm" name=top>
< FRAME SRC="bot.htm" name=bot>
< /FRAMESET>
< /FRAMESET>
尝试⼀下，可能是这样的效果!
top表⽰主窗⼝，location表⽰当前窗⼝，如果你的⽂件只有⼀个框架，没有iframe和frame，那么是完全⼀致的，没有区别。
top.location是在顶层frame中打开新页
window.location是在当前frame中打开新页
parent.location在当前窗⼝的⽗窗⼝打开Url地址
JS页⾯跳转和刷新的⼏种⽅式
页⾯跳转
window.location.href="index.php";
window.history.back(-1);//类似于按钮，参数是负⼏，就后退⼏次。
window.navigate("index.jsp"); //navigate对象包含有关浏览器的信息，也可以作为页⾯跳转，后⾯直接加要跳转的地⽅。
self.location.href=index.htm;
//self指代当前窗⼝对象，属于window最上层的对象;
//location.href 指的是某window对象的URL地址.
//self.location.href指当前窗⼝的URL地址，去掉self默认为当前窗⼝的URL地址.
top.location=index.php;
//top 属性返回最顶层的先辈窗⼝。
//该属性返回队⼀个顶级窗⼝的只读引⽤。
//如果窗⼝本⾝就是⼀个顶级窗⼝，top 属性存放对窗⼝⾃⾝的引⽤。
//如果窗⼝是⼀个框架，那么 top 属性引⽤包含框架的顶层窗⼝。
<(-1);//不刷新页⾯
history.back();//不刷新页⾯
Javascript页⾯刷新
(0)
load()
3 location=location
4 location.assign(location)
Command('Refresh')
6 window.navigate(location)
place(location)
8 document.URL=location.href
⾃动刷新
页⾯⾃动刷新：把如下代码加⼊<head>区域中
<meta http-equiv="refresh" content="2">
其中2指每隔2秒刷新⼀次页⾯.
JS实现页⾯⾃动刷新
<script language="JavaScript">
setTimeout('load()',1000) //指定1秒刷新⼀次
</script>
JS刷新框架的脚本语句
//如何刷新包含该框架的页⾯⽤
[javascript] view plain copy print?
<script language=JavaScript>
load();
</script>
//⼦窗⼝刷新⽗窗⼝
[javascript] view plain copy print?
<script language=JavaScript>
self.load();
</script>
(或<a href="javascript:load()">刷新</a> )
//如何刷新另⼀个框架的页⾯⽤
[javascript] view plain copy print?
<script language=JavaScript>
parent.另⼀load();
</script>
如果想关闭窗⼝时刷新或者想开窗时刷新的话，在<body>中调⽤以下语句即可。
jquery⽅法
$(location).attr('href', '//www.jb51');
$(window).attr('location','//www.jb51');
$(location).prop('href', '//www.jb51')
总结
以上就是这篇⽂章的全部内容了，希望本⽂的内容对⼤家的学习或者⼯作具有⼀定的参考学习价值，谢谢⼤家对的⽀持。
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论