1、history.back()，加载历史列表中的前一个 URL：
（1）运行程序先进入此页面，点击文字链接后进入下一个页面：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<a href="History对象.html">请点击进入下一个页面</a>
</body>
</html>
（2）点击返回上一级按钮可以再次回到第一个页面：
代码如下：
go()：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>History对象</title>
<script>
function fanhui(){
history.go(-1);
}
</script>
</head>
<body>
<input type="button" value="返回上一页" onclick="fanhui()"/><br />
</body>
</html>
back()：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>History对象</title>
<script>
function fanhui(){
history.back();
}
</script>
</head>
<body>
<input type="button" value="返回上一页" onclick="fanhui()"/><br />
</body>
</html>
这两个方法是等效的。
2、 history.forward()方法，加载历史列表中的下一个 URL
先设置三个页面：
页面一：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h2>这是第一个页面</h2>
<a href="2.html">我是第一个页面，请点击！</a>
</body>
</html>
页面二：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>History对象</title>
<script>
function fanhui(){
history.go(1);
}
</script>
</head>
<body>
<h2>这是第二个页面</h2>
<input type="button" value="进入下一个页面" onclick="fanhui()"/><br />
<a href="3.html">进入第三个页面</a>
</body>
</html>
当然，可以用history.forword()方法，效果是一样的。
页面三：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h2>这是第三个页面</h2>
<input type="button" value="跳转到第二个页面" onclick="javascript:location.href=‘2.html‘"/>
</body>
</html>
先进入第一个页面：
点击文字链接可以进入第二个页面：
再次点击文字链接进入第三个页面：
点击返回上一个页面（页面二）：
进入页面二后点击进入下一个页面按钮：
可以再次进入页面三：
原文地址：https://www.cnblogs.com/zhai1997/p/12222550.html
时间： 2024-11-09 06:22:27