前端笔记69——窗口事件

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/chengxu_kuangrexintu/article/details/86684068

前言

前面分享了鼠标事件、键盘事件、表单事件,再分享一个窗口事件。窗口英文是windows,简单理解窗口事件是windows有关的事件。

事件名称和触发场景

事件名称          触发场景

onload           当对象加载完成以后触发
onresize         当窗口改变的时候触发 

onload事件例子

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			//window 最顶层的对象
			window.onload = function() {
				var oBox = document.getElementById("box")
				// oBox --- null
				console.log(oBox)
				alert(oBox.innerHTML)
			}
		</script>
	</head>

	<body>
		<div id="box">box1</div>
	</body>
</html>

onresize事件例子

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			window.onresize = function(){
				// 窗口改变的时候去计算宽高,来做布局
				// 获取浏览器区域的高度
				console.log(document.documentElement.clientHeight)
			}
		</script>
	</head>
	<body>
	</body>
</html>

猜你喜欢

转载自blog.csdn.net/chengxu_kuangrexintu/article/details/86684068
69