当你获取到你想要的元素，这并不是你的最终目的，下一步你需要获取这个元素的属性。
它的语法：object.getAttribute(attribute); 它返回的是你当前查找的元素的某一属性值。
需要注意：它并不属于document对象，不能通过document对象直接调用，只能通过元素节点对象调用，对于这一点应该很好理解，如果可以通过document对象直接调用，那么getAttribute方法就没有什么存在的价值了。
还有一点，在获取元素属性值的同时，需要注意可能出现的该元素节点下没有属性的特殊情况，可以通过判断是否为null来解决。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>筱雨生 - 博客园</title>
</head>
<body>
<h1>筱雨生</h1>
<p>時光飛逝，莫讓網絡蹉跎了歲月</p>
<div id="myBlog">
<ul>
<li title="JavaScript">JavaScript</li>
<li title="HTML">HTML</li>
<li title="CSS">CSS</li>
<li title="我的随笔">我的随笔</li>
<li>其他</li>
</ul>
</div>
<script>
var myLabel = document.getElementsByTagName('li');
for(var i=0; i<myLabel.length; i++){
var myLabelAttribute = myLabel[i].getAttribute('title');
if(myLabelAttribute != null){
alert('title的内容是：' +myLabelAttribute);
}
}
</script>
</body>
</html>
有了上面的代码，我们可以轻松的自定义一个方法来实现获取任意元素中任意属性值。
function getMyLabelAttribute(labelName,labelAttribute){
var myLabel = document.getElementsByTagName(labelName);
for(var i = 0; i<myLabel.length; i++){
var myLabelAttribute = myLabel[i].getAttribute(labelAttribute);
if(myLabelAttribute){
alert(labelName + '中' + labelAttribute + '的内容是' + myLabelAttribute);
}
}
}
getMyLabelAttribute('li','title');
需要注意的是，自定义函数中，if的condition去掉了原来的!= null，两者是等价的关系，意思都是不为空。
语法：object.setAttribute( attribute, value);
用来更改目标元素的属性值，与getAttribute相同，setAttribute也是作用于元素节点。
var myLabel = document.getElementsByTagName('li');
alert(myLabel[4].getAttribute('title'));
var newAttribute = myLabel[4].setAttribute('title', 'JavaScript是一种若类型的编程语言');
alert(myLabel[4].getAttribute('title'));
通过上面这段代码可以看出，setAttribute方法可以为元素节点创建原本没有的属性，并且可以设置它的值，正因如此，当我需要为一堆元素设置属性值的时候，我不需要知道它原来有没有这个属性和属性值。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>筱雨生 - 博客园</title>
</head>
<body>
<h1>筱雨生</h1>
<p>時光飛逝，莫讓網絡蹉跎了歲月</p>
<div id="myBlog">
<ul>
<li title="JavaScript">JavaScript</li>
<li title="HTML">HTML</li>
<li title="CSS">CSS</li>
<li title="我的随笔">我的随笔</li>
<li>其他</li>
</ul>
</div>
<script>
var myLabel = document.getElementsByTagName('li');
for(var i=0; i<myLabel.length; i++){
var newLabelAttribute = [0,1,2,3,4];
myLabel[i].setAttribute('title',newLabelAttribute[i]);
alert(myLabel[i].getAttribute('title'));
}
</script>
</body>
</html>
三、题外话
只有基本功扎实，才可能发挥出你的潜质来。