【DOM 编程艺术】3.5 获取和设置属性

getAttribute用于获取各个属性，setAttribute方法可以更改属性节点的值。

1.getAttribute

getAttribute不能通过document来调用，只能通过元素节点对象调用，比如可以与getElementsByTagName方法合用。

<script type="text/javascript">
    //想获取p标签的title属性：
    var title = document.getElementsByTagName("p");
    console.log(title[0].getAttribute("title")); //a genele reminder
</script>

多个元素：

<script type="text/javascript">
    //想获取多个p标签的title属性：
    var title = document.getElementsByTagName("p");
    for(var i=0;i<title.length;i++){
        console.log(title[i].getAttribute("title"));
    }
</script>

如果页面中有多个p标签，且有的p标签没有title属性，那么会输出一个null，为了不让null输出，代码可以做如下修改：

<script type="text/javascript">
    var title = document.getElementsByTagName("p");
    for(var i=0;i<title.length;i++){
        var titleText = title[i].getAttribute("title");
        if(titleText)
            console.log(titleText);
    }
</script>

2.setAttribute

<script type="text/javascript">
    //为h1添加一个text属性，属性值是h2
    var text = document.getElementsByTagName("h1");
    text[0].setAttribute("text","h2");
</script>