DOM是按照先后顺序执行的，如要将JS放在前面，需要确保DOM元素已经加载完毕，因此我们常用页面加载事件window. onload来调用JS代码。
下面将介绍三种页面加载事件的方法：
<head>
<script>
方法一：传统方式使用window. onload，缺点：只能使用一次，加载多次时，后面会覆盖前面。
window. onload = function() {
var btn = document . querySelector( ' button' );
btn. addEventListener('click', function() {
alert('点击我);
})
}
方法二：可同时加载多次
window. addEventListener('load', function() {
var btn = document . querySelector( ' button' );
btn. addEventListener( 'click', function() {
alert('点击我' );
})
})
window . addEventListener( 'load', function() {
alert(22);
})
方法三：
document . addEventListener( 'DOMContentLoaded', function() {
alert(33);
})
//load等页面内容全部加载完毕，包含页面dom元素图片flash，css等等
// DOMContentLoaded 是DOM加载完毕，不包含图片falsh Css等就可以执行加载速度比load更快一些
</script>
</head>
<body>
<button>点击</button>
</body>
|
