Web APIs 第五天 网页特效篇

1.滚动事件

​ 谁滚动给谁加事件

​ 如果整个网页有滚动条了，事件加给window或document

2.加载事件

​ 如果想要所有资源加载完毕之后在执行，给window加事件

只加载DOM节点，不等全部加载完，给document加DOMContentLoaded事件

3.三大家族

scroll家族

​ scrollWidth、scrollHeight获取宽高 获取的是内容+padding+溢出

​ scorll获取宽高不可以设置宽高，设置的话还用style修改

​ 获取向上/向右卷起的距离scrollTop/scrollLeft 可以获取也可以修改属性值

​ 如果是整个页面的向上卷起值，获取的是HTML的，用document.documentElement.scrollTop

offset家族

​ offsetWidth/offsetHeight获取宽高，获取的是内容+padding+border

​ 测量盒子的距离时，offsetTop/offsetLeft可以获取，也不能修改

​ 位置参照定位的元素，如果没有定位，参照document

​ offsetParent获取定父元素 parentNode获取的是标签父元素

client家族

​ 获取宽高 获取的是内容+padding

​ resize事件，会在窗口尺寸改变时触发，通过document.documentElement.clientWidth获取屏幕的宽度