1.element.getAttribute(attributename)方法用來返回指定屬性名的屬性值，返回的類型是字符串類型

2.element.getAttributeNode(attributename)方法從當前元素節點(nodeType值為1的節點)element中通過名稱獲取屬性節點(nodeType值為2的節點)，返回值是指定的屬性節點

3.element.setAttribute(attributename,attributevalue)方法添加指定的屬性，并為其賦指定的值。如果這個指定的屬性已存在，則僅設置/更改值，無返回值

4.element.setAttributeNode(attributenode)方法用來向元素中添加指定的屬性節點。如果這個指定的屬性已存在，則此方法會替換它

5.element.removeAttribute(attributename)方法用來刪除指定的屬性。沒有返回值

注意：此方法與 removeAttributeNode() 方法的差異是：removeAttributeNode() 方法刪除指定的 Attr 對象，而此方法刪除具有指定名稱的屬性。結果是相同的。同時此方法不返回值，而 removeAttributeNode() 方法返回被刪除的屬性，以 Attr 對象的形式

6.element.removeAttributeNode(attributenode)方法用來刪除指定的屬性，并以 Attr Node 對象返回被刪除的屬性。返回值是Attr類型的對象

7.element.hasAttribute(attributename)方法用來判斷如果存在指定屬性，則 hasAttribute() 方法返回 true，否則返回 false

8.node.hasAttributes()方法用來判斷節點(不僅僅是元素節點element)是否擁有屬性，擁有屬性則返回true，否則返回false。如果指定節點不是元素節點，則返回值始終是 false。

注意：

**- Node(節點)是DOM層次結構中的任何類型對象的通用名稱，Node有很多類型，如元素節點(element)，屬性節點(attr)，文本節點(text)，注釋節點(comments)等，通過NodeType區分

**- Element繼承了Node類，也就是說Element是Node多種類型中的一種，即當NodeType為1時Node即為ElementNode，另外Element擴展了Node，Element擁有id、class、children等屬性

**- 簡單的說就是Node是一個基類，DOM中的Element，Text和Comment都繼承于它。 換句話說，Element，Text和Comment是三種特殊的Node，它們分別叫做ELEMENT_NODE, TEXT_NODE和COMMENT_NODE

那么下面為什么”document.body.childNodes.length”的結果是9呢？

實際上Node表示的是DOM樹的結構，在html中，節點與節點之間是可以插入文本的，這個插入的空隙就是TEXT_NODE

這下就順理成章了，body的直系元素（3）＋ COMMENT_NODE(1) + TEXT_NODE(5) = 9

注意：我們用childNodes找到了NodeList，但我們操作DOM時往往不想操作Node(我只想操作元素Element)，那么如何獲取ElementList呢？其實我們經常使用的getElementsByXXX返回的就是一個ElementList，只不過它的真實名字是ElementCollection。就像NodeList是Node的集合一樣，ElementCollection也是Element的集合。但需要特別注意的是：NodeList和ElementCollcetion都不是真正的數組。如果document.getElementsByTagName(‘a’) instanceof Array，那么必然是false。

總結

以上是生活随笔為你收集整理的HTML DOM之属性的各种操作方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。