属性：是对象的性质与对象之间关系的统称。HTML中标签可以拥有属性，，属性为 HTML 元素提供附加信。
属性总是以名称/值对的形式出现，比如：name="value"。
属性值始终被包括在引号内。双引号是最常用的，在某些个别的情况下，比如属性值本身就含有双引号，必须使用单引号，
属性总是在 HTML 元素的开始标签中规定。
属性实例
HTML 链接由 <a> 标签定义。链接的地址在 href 属性中指定：
< a href="http://www.baidu.com"> a </a>
<h1> 定义标题的开始。
<h1> 拥有关于对齐方式的附加信息。
<body> 定义 HTML 文档的主体。
<body bgcolor="yellow"> 拥有关于背景颜色的附加信息。
<table> 定义 HTML 表格。
<table> 拥有关于表格边框的附加信息。
对属性的操作
1、通过定位找到该元素存与变量中
var a = document.getElementById("id")
2、对该元素的属性进行操作
a.setAttribute( “ 属性名”，“属性值” )；
-- 添加更改属性
a.getAttribute( " 属性名 " );
-- 获取属性的值
a.removeAttribute( " 属性名 " );
-- 移除属性
-- 最新的属性会覆盖原来的属性不会出现2个相同的属性
例题
建按钮与有背景色的div，点击按钮背景色改变
<head> <title></title> <style type="text/css"> .div { width: 100px; height: 100px; background-color: red; float: left; margin-right: 10px; } </style> </head> <body> <input type="button" value="验证" id="btn1" /><br /> <div class="div" aa="1"></div> <div class="div" aa="1"></div> <div class="div" aa="0"></div> <div class="div" aa="0"></div> <div class="div"></div> <div class="div"></div> </body> </html> <script type="text/javascript"> document.getElementById(‘btn1‘).onclick = function () { var oDivs = document.getElementsByClassName(‘div‘); for (var i = 0; i < oDivs.length; i++) { if (oDivs[i].getAttribute(‘aa‘) == ‘1‘) oDivs[i].style.backgroundColor = "blue"; if (oDivs[i].getAttribute(‘aa‘) == ‘0‘) oDivs[i].style.backgroundColor = "green"; } } </script>
View Code效果图
JS DOM操作（二） Window.docunment对象——操作属性