页面前进、页面后退、页面跳转的方法

简介: 页面前进、页面后退、页面跳转的方法

以下是我关于页面前进,页面后退,页面跳转的学习笔记,对于js初学者会比较有用。


页面前进,页面后退,本质上也是页面跳转。这是一个宽泛的概念,看个人怎么理解了。不过不管是页面的前进,后退,还是跳转到另一个页面,这都属于在浏览器里进行的操作。


关于浏览器的所有操作都是BOM

1.页面前进:

以下有两种方法

<a href="javascript:history.go(1)"> 前进</a>
<a href="javascript:history.forward()">前进</a>

值得一提的是go()括号里的参数,1表示前进,-1表示反方向前进,也就是后退,正负表示方向。

2.页面后退:

以下有两种方法

<a href="javascript:history.go(-1)">后退</a>
<a href="javascript:history.back()">后退</a>

3.页面跳转:

打开新的页面进行跳转:

window.open('页面链接')        

在原页面进行跳转(这种方法前面window可加可不加):

window.location.href='页面链接' 

总结:我们需要创建两个html文件。


          第一个html文件作为页面一,第二个html文件作为页面二。


页面一里写  <a href="javascript:history.forward()">前进</a>


页面二里写  <a href="javascript:history.back()">后退</a>


这个代码的意思是历史记录前进和后退,所以两个页面必须建立联系,才能实现页面之间的前进后退。


       页面跳转的话,直接用 window.open('页面链接')   或window.location.href='页面链接' 即可。


相关文章
|
6月前
ionic 4 点击按钮跳转页面传值并刷新
ionic 4 点击按钮跳转页面传值并刷新
53 2
|
12月前
|
JavaScript 前端开发 Go
怎样控制浏览器前进、后退、页面跳转?
怎样控制浏览器前进、后退、页面跳转?
170 0
不使用a标签,实现点击跳转到其他页面的代码
不使用a标签,实现点击跳转到其他页面的代码
|
27天前
|
数据采集 搜索推荐 UED
什么是404页面
404页面,也被称为“未找到页面”,是当用户尝试访问一个不存在的网页时,服务器返回的一个错误页面。这个页面告诉用户他们请求的页面不存在或无法找到,通常是因为输入了错误的链接或请求的页面已被删除或移动
|
存储 前端开发
ajax实现简单的点击左侧菜单,右侧加载不同网页
ajax实现简单的点击左侧菜单,右侧加载不同网页
84 0
|
JavaScript
JS 页面前进、页面后退、页面跳转的方法
JS 页面前进、页面后退、页面跳转的方法
(uniapp跳转回显),A页面进入B页面,B页面返回A页面,并传值给A页面(技巧绝对好用慢慢看)
(uniapp跳转回显),A页面进入B页面,B页面返回A页面,并传值给A页面(技巧绝对好用慢慢看)
566 0
(uniapp跳转回显),A页面进入B页面,B页面返回A页面,并传值给A页面(技巧绝对好用慢慢看)
|
Web App开发 存储 缓存
【译】点击浏览器的前进后退按钮时,页面的缓存机制
【译】点击浏览器的前进后退按钮时,页面的缓存机制
557 0
【译】点击浏览器的前进后退按钮时,页面的缓存机制
「服务范围」页面
5招教你打造有超强吸引力的「服务范围」页面
274 0