JavaScript的文档对象-History对象，Location对象，Window对象

最新推荐文章于 2024-08-25 09:57:22 发布

定位心海的猫0.0

最新推荐文章于 2024-08-25 09:57:22 发布

阅读量51

点赞数

文章标签： javascript 前端 java

本文链接：https://blog.csdn.net/weixin_68829057/article/details/127077964

版权

History对象

History对象:有关客户访问过的URL的信息。
名称说明
back() 加载 History 列表中的上一个URL
forward(() 加载History列表中的下一个URL
go("url" or number) 加载History列表中的一个URL或要求浏览器移动指定的页面数

back()方法相当于后退按钮
forward()方法相当于前进按钮
go(1)代表前进1页，等价于forward()方法; go(-有代表后退1页，等价于back()方法;

Location对象

Location对象:有关当前URL的信息。
属性说明
host 设置或检索位置或URL的主机名和端口号
hostname 设置或检索位置或URL的主机名部分
href 设置或检索完整的 URL 字符串
方法说明
assign("url") 加载URL 指定的新的HTML文档
reload0 重新加截当前页
replace("url") 通过加载URL 指定的文档来替换当前文档

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body> 
		<input type="button" id="btn1" value="打开02.html" />
		<script type="text/javascript">
			document.getElementById("btn1").onclick=function(){
				
				location.href="02.html"
			}
			
			
		</script>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<input type="button" id="btn1" value="back" />
		<input type="button" id="btn2" value="打开0.3html" />
		<input type="button" id="btn3" value="forward()" />
		<input type="button" id="btn4" value="go" />
		 
		 <script type="text/javascript">
		 	
		 	document.getElementById("btn1").onclick=function(){
		 		history.back()
		 		
		 	}
		 	document.getElementById("btn2").onclick=function(){
		 		location.href="03.html"
		 		
		 	}
		 	document.getElementById("btn3").onclick=function(){
		 		history.forward()
		 		
		 	}
		 	document.getElementById("btn4").onclick=function(){
		 		history.go(1)
		 		
		 	}
		 	
		 </script>
		 
		 
		 
		
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<input type="button" id="btn1" value="返回0.2html" />
		<input type="button" id="btn2" value="go" />
		<script type="text/javascript">
			
			document.getElementById("btn1").onclick=function(){
				history.back()
				
			}
			document.getElementById("btn2").onclick=function(){
				location.assign("http://www.douyin.com")
				
			}
			
			
		</script>
		
		 
	</body>
</html>

Window对象常用事件
事件说明
onloado 对象装载完成后触发
onscralld 窗口的滚动条被拖动时触发
enresizol 窗口的大小改变时触发
onblur(/onfocus0 窗口失去/获得焦点时触发
onerror() 遇到执行错误时触发
onunload() 对象被卸载后触发