WEB API —— Element 之 属性

元素——文档中所有对象继承的最基础的基类。他只有所有元素所共有的方法和属性。更具体的类继承自 Element 。

例如：

HTML Element接口是所有 HTML 元素的基本接口，而 SVG Element 接口是所有 SVG 元素的基本接口。

大多数功能是在类的层级下具体指定的。

属性：

1.attribute

Element.attributes 属性返回指定节点的所有属性的实时集合。 它是一个 NamedNodeMap，而不是一个Array，所以它没有Array方法，而且Attr节点的索引在浏览器中可能会有所不同。 更具体地说，属性是表示关于该属性的任何信息的键/值对的字符串。

2.classLists

Element.classList —— 只读属性，返回元素的类的实时 DOMTokenList 集合。

方法：

1）add （String） 给元素添加一个 class，如果给定的这个 class 已添加则忽略；

2）remove（String） 删除元素的一个给定 class，如果元素没有这个 class ，也不报错；

3）item（Number） 返回 classList 指定 index 的值 ，类似于Element.classList[Number]；

4）toggle（String） 如果存在这个 class，则将其删除，并返回 false；如果不存在这个 class，则将其添加在元素上，并返回 true；

5）contains（String） classList中存在 String 这个 class，则返回 true，否则返回 false；

6）replace（old Class，newClass） 用 newClass 替换 oldClass。oldClass 不存在则不替换。

3.className

Element.className—— 获取或设置元素的 class ，获取的 class 是字符串。

4.

Element.clientHeight——height + padding

Element.clientWidth——width+ padding

HTMLElement.offsetHeight——height + padding + border-top + border-bottom

HTMLElement.offsetWidth——width+ padding + border-left + border-right

Element.scrollHeight / Element.scrollWidth 包括被掩藏未显示的部分

以上三种都会将值转换为整数，如要获得小数值，可使用 Element.getBoundingClientRect()，这个方法会返回一个包含元素尺寸及其相对于视窗的位置的对象。

5.innerHTML

获取或设置元素的内容