元素的属性；

Posted 2021-01-23 qinlinkun

div.attributes是元素的所有标签属性构成的数据集合

div.classList是所有用class起名的元素构成的集合      在classList的原型链上可以看到add()和remove()

（1）client系列

clientWidth/clientHeight 就是我们设置的宽/高+内边距

clientLeft/clientTop 边框值

-（2）offsetxilie

offsetWidth/offsetHeight 是我们设置的宽/高+边框+内边距

offsetLeft/offsetTop是元素外边距到父级内边距的距离

使用它（offsetLeft/offsetTop）的时候，它的父级必须有position：absolute；，因为他们的参照物就是父级的position

position的值可以是absolute和fixed ，如果父级元素不设position，就向上查找，直到body。

offsetparent 返回这个元素的父级元素

（3）scroll系列

scrollWidth/scrollHeight就是我们的内容的宽/高+内边距

scrollLeft/scrollTop滚动条卷走的宽度和高度

如果我们设置了小数，都会向上取整

offset往往和我们做元素的运动有关

1、offset必须和position配合使用，值必须是absolute

2、offset有初始值，标准浏览器下是8px，低版本没有

3、document.body获取的是文档中的body标签

　　document.documentElement获取的是文档中的根节点，html

（1）document.body.clientWidth

（2）document.documentElement.clientWidth

这两者都是获取的可见区的宽度

（1）和（2）获取的width值不一样，需要兼容  IE6不支持document.documentElement

兼容性写法：var w=document.documentElement.clientWidth||document.body.clientWIdth