元素属性概述
- 一切从属性获取的值和设置到属性上的值必须都是字符串,所以都要先类型转换,再计算
获取元素的属性值
- 方法1
- 方法
- var strValue = elem.getAttribute(“属性名”);
- 何时使用:只找一个属性时
- 方法
- 方法2:elem.attributes集合 —— 包含了当前元素所有属性的节点对象
- 方法
- elem.attributes[i/”属性名”] ——> 返回一个属性节点
- elem.attributes[i/”属性名”].value —— 属性值
- 何时使用:遍历一个元素的所有属性时
- 方法
- 方法3
- 方法:
- elem.getAttributeNode(“属性名”) —— 返回一个属性节点
- elem.getAttributeNode(“属性名”).value —— 返回属性值
- 方法:
修改元素的属性值
- elem.setAttribute(“属性名”,”属性值”)
- 何时使用:只设置一个属性值时
- elem.setAttributeNode(属性节点对象)
移除元素的属性
- elem.removeAttribute(“属性名”)
- elem.removeAttributeNode(属性节点)
判断是否包含指定属性
- elem.hasAttribute(“属性名”)
Property vs Attribute
- Property:内存中对象的属性,通常通过 . 来访问
- Attribute:指出现在页面html代码中的属性
- 标准属性:Property等效于Attribute,操作标准属性时应尽量使用HTML DOM
- H5自定义属性:只能用setAttribute
- H5规定:凡是自定义属性都要加data-前缀
- 获取自定义属性值:a.dataset.属性名
- 设置自定义属性值:a.dataset.属性名 = 属性值