0926课后小结

最新推荐文章于 2024-11-06 17:29:08 发布

刻骨◎

最新推荐文章于 2024-11-06 17:29:08 发布

阅读量121

点赞数

文章标签：前端 servlet

本文链接：https://blog.csdn.net/m0_68968100/article/details/127062731

版权

本文总结了History对象，包括back()、forward()和go()方法，用于控制浏览器历史记录的前进和后退。同时提及Window对象的常用事件，是前端开发者的重要知识点。

摘要由CSDN通过智能技术生成

History对象

History对象：有关客户访问过的URL的信息

名称	说明
back()	加载History列表中的上一个URL
forward()	加载History列表中的下一个URL
go("url" or number)	加载History列表中的一个URL或要求浏览器移动指定的页面

back()方法相当于后退按钮

forward()方法相当于前进按钮

go(1)代表前进1页，等价于forward()方法

go(-1)代表后退1页，等价于back()方法

案例：

    <body>
		<input type="button" name="" id="a1" value="打开02.html" />
		<script type="text/javascript">
			a1.onclick=function(){
				location.href="02.html"
			}
		</script>
	</body>

    <body>
		<input type="button" name="" id="btn1" value="back" />
		<input type="button" name="" id="btn2" value="打开03.html" />
		<input type="button" name="" id="btn3" value="forwar()" />
		<input type="button" name="" id="btn4" value="go" />
		<script type="text/javascript">
			btn1.onclick=function(){
				history.back()//返回到上一页
			}
			btn2.onclick=function(){
				location.href="03.html"
			}
			btn3.onclick=function(){
				history.forward()//跳转到history列表中下一页
			}
			btn4.onclick=function(){
				history.go(-1)//相当于forward
			}
		</script>
	</body>

    <body>
		<input type="button" name="" id="butn1" value="返回02.html" />
		<input type="button" name="" id="butn2" value="go" />
		<script type="text/javascript">
			butn1.onclick=function(){
				location.href="02.html"
			}
			butn2.onclick=function(){
				history.go(-1)
			}
		</script>
	</body>

结果

属性、方法和事件

鼠标事件	意义
onmousedown	按下鼠标键
onmousemove	移动鼠标
onmouseout	鼠标离开某一个网页对象
onmouseover	鼠标移动到某一个网页对象上
onmouseup	松开鼠标键
onclick	单击鼠标键
ondblclick	双击鼠标键

键盘事件	意义
onkeydown	按下一个键
onkeyup	松开一个键
onkeypress	按下然后松开一个键

Window对象常用事件

事件	说明
onload()	对象装在完成后触发
onscroll()	窗口的滚动条被拖动时触发
onresize()	窗口的大小改变时触发
onblur()/onfocus()	窗口失去/获得焦点时触发
onerror()	遇到执行错误时触发
onunload()	对象被卸载后触发