在 JavaScript 中，使用元素的 getAttribute() 方法可以读取指定属性的值。用法如下：
getAttribute(name)
参数 name 表示属性名称。
使用元素的 attributes 属性、getAttributeNode() 方法可以返回对应属性节点。
示例1
下面示例访问红色盒子和蓝色盒子，然后读取这些元素所包含的 id 属性值。
红盒子 蓝盒子
var red = document.getElementById("red"); //获取红色盒子
console.log(red.getAttribute("id")); //显示红色盒子的id属性值
var blue = document.getElementById("blue"); //获取蓝色盒子
console.log(blue.getAttribute("id")); //显示蓝色盒子的id属性值
示例2
HTML DOM 也支持使用点语法读取属性值，使用比较简便，也获得了所有浏览器的支持。
var red = document.getElementById("red");
console.log(red.id);
var blue = document.getElementById("blue");
console.log(blue.id);
对于 class 属性，则必须使用 className 属性名，因为 class 是 JavaScript 的保留字；对于 for 属性，则必须使用 htmlFor 属性名，这与 CSS 脚本中 float 和 text 属性被改名为 cssFloat 和 cssText 是一个道理。
示例3
使用 className 读写样式类。
文本框：
var label = document.getElementById("label1");
console.log(label.className);
console.log(label.htmlFor);
示例4
对于复合类样式，需要使用 split() 方法劈开返回的字符串，然后遍历读取类样式。
红盒子
//所有类名生成的数组
var classNameArray = document.getElementById("red").className.split(" ");
for (var i in classNameArray) { //遍历数组
console.log(classNameArray[i]); //当前class名
}
