history
history 对象
- back() 返回到历史记录上一个页面
- forward() 返回到历史记录下一个页面
- go() 返回到历史记录多步
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="14.history.html">页面1</a>
<a href="14.history_2.html">页面2</a>
<a href="14.history_3.html">页面3</a>
<div>这是页面1</div>
<button id="btn">按钮</button>
<script>
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="14.history.html">页面1</a>
<a href="14.history_2.html">页面2</a>
<a href="14.history_3.html">页面3</a>
<div>这是页面2</div>
<button id="btn">按钮</button>
<script>
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="14.history.html">页面1</a>
<a href="14.history_2.html">页面2</a>
<a href="14.history_3.html">页面3</a>
<div>这是页面3</div>
<button id="btn">按钮</button>
<script>
{
let btn = document.querySelector("#btn");
btn.onclick = function(){
history.back();
};
}
</script>
</body>
</html>
history.back(); 返回到历史记录上一个页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="14.history.html">页面1</a>
<a href="14.history_2.html">页面2</a>
<a href="14.history_3.html">页面3</a>
<div>这是页面1</div>
<button id="btn">按钮</button>
<script>
{
let btn = document.querySelector("#btn");
btn.onclick = function(){
history.forward();
};
}
</script>
</body>
</html>
history.forward(); 返回到历史记录下一个页面
history.go(num); 返回到历史记录多步
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="14.history.html">页面1</a>
<a href="14.history_2.html">页面2</a>
<a href="14.history_3.html">页面3</a>
<div>这是页面3</div>
<button id="btn">按钮</button>
<script>
{
let btn = document.querySelector("#btn");
btn.onclick = function(){
// history.back();
history.go(-2);
};
}
</script>
</body>
</html>
直接回退两步,如果正数则前进多步
(后续待补充)