API其他事件

---

其他事件

页面加载事件

加载外部资源加载完毕时触发的事件

• 事件名：load
  监听页面所有资源加载完毕：
  给window添加load事件
  语法：window.addEventListener('load',function() {执行的操作})
  注意：不仅可以监听整个页面资源加载完毕，也阔以针对某个资源绑定load事件
• 当初始的HTML文档被完全加载和解析完成之后，DOMContentLoaded事件被触发，而无需等待样式表、图片等完全加载
  事件名：DOMContentLoaded
  监听页面DOM加载完毕：
  给document添加DOMContentLoaded事件
  语法：document.addEventListener('DOMContentLoaded',function() {执行的操作})

元素滚动事件

滚动条在滚动的时候持续触发的事件
事件名：scroll
监听整个页面滚动：
语法：window.addEventListener('scroll',function() {执行的操作})

获取位置

属性：scrollLeft、scrollTop
获取元素内容往左、往上滚出去看不到的距离
获得的值是数字型，可读写
尽量在scroll事件里面获取被卷去的距离
语法：

div.addEventListener('scroll',function() {
	console.log(this.scrollTop)
})

页面尺寸事件

会在窗口尺寸改变的时候触发事件
事件名：resize
语法：window.addEventListener('resize', function() {执行的代码})
检测屏幕宽度：

window.addEvnetListener('resize', function(){
	let w = document.documentElement.clientWidth
	console.log(w)
})

获取元素宽高

属性：clientWidth、clientHeight