使用 history 对象

最新推荐文章于 2025-09-22 20:02:39 发布

原创最新推荐文章于 2025-09-22 20:02:39 发布 · 819 阅读

0 ·

CC 4.0 BY-SA版权

WEB-DOM 专栏收录该内容

36 篇文章

订阅专栏

本文详细介绍了如何使用JavaScript的history对象实现网页中的前后操作，包括后退、前进等功能，通过HTML链接和JavaScript代码演示了具体实现方式。

<!DOCTYPE HTML>
<html>
<head>
<title>使用 history 对象</title>
<meta charset="utf-8" />
</head>
<body>
	<h2>2-1.html</h2>
	<div>
		<a href="2-1.html">1</a>  
		<a href="2-2.html">2</a>  
		<a href="2-3.html">3</a>  
	</div><br/>
	<div>
		<a href="javascript:history.go(-1)">后退一次</a>  
		<a href="javascript:history.go(1)">前进一次</a>  
		<a href="javascript:history.go(2)">前进二次</a>  
	</div>
</body>
</html>

2-2.html

<!DOCTYPE HTML>
<html>
<head>
<title>使用 history 对象</title>
<meta charset="utf-8" />
</head>
<body>
	<h2>2-2.html</h2>
	<div>
		<a href="2-1.html">1</a>  
		<a href="2-2.html">2</a>  
		<a href="2-3.html">3</a>  
	</div><br/>
	<div>
		<a href="javascript: ">后退二次</a>  
		<a href="javascript: ">后退一次</a>  
		<a href="javascript: ">前进一次</a>  
		<a href="javascript: ">前进二次</a>  
	</div>
</body>
</html>

2-3.html

<!DOCTYPE HTML>
<html>
<head>
<title>使用 history 对象</title>
<meta charset="utf-8" />
</head>
<body>
	<h2>2-3.html</h2>
	<div>
		<a href="2-1.html">1</a>  
		<a href="2-2.html">2</a>  
		<a href="2-3.html">3</a>  
	</div><br/>
	<div>
		<a href="javascript: ">后退二次</a>  
		<a href="javascript: ">后退一次</a>  
		<a href="javascript: ">前进一次</a>  
	</div>
</body>
</html>