在 JavaScript 中，使用元素的 removeAttribute() 方法可以刪除指定的屬性。用法如下：
removeAttribute(name)
參數 name 表示元素的屬性名。
示例1
下面示例演示了如何動態設置表格的邊框。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<script> window.onload = function () { //綁定頁面加載完畢時的事件處理函數 var table = document.getElementByTagName("table")[0]; //獲取表格外框的引用 var del = document.getElementById("del"); var reset = document.getElementById("reset"); del.onclick = function () { table.removeAttribute("border"); } reset.onclick = function () { table.setAttribute("border", "2"); }</script><table width="100%" border="2"> <tr> <td>數據表格</td> <tr></table><button id="del">刪除</button><button id="reset">恢復</button> |
在上面示例中設計了兩個按鈕，并分別綁定了不同的事件處理函數。單擊“刪除”按鈕即可調用表格的 removeAttribute() 方法清除表格邊框，單擊“恢復”按鈕即可調用表格的 setAttribute() 方法重新設置表哥便可的粗細。
示例2
下面示例演示了如何自定義刪除類函數，并調用該函數刪除指定類名。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<script> function hasClass (element, className) { //類名檢測函數 var reg = new RegExp ('(\\s|^)' + className + '(\\s|$)'); return reg.test (element, className); //使用正則檢測是否有相同的樣式 } function deleteClass (element, className) { if (hasClass (element, className)) { element.className.replace (reg, ' '); //捕獲要刪除樣式，然后替換為空白字符串 } }</script><div id="red" class="red blue bold">盒子</div><script> var red = document.getElementById ("red"); deleteClass (red, 'blue');</script> |
上面代碼使用正則表達式檢測 className 屬性值字符串中是否包含指定的類名，如果存在，則使用空字符串替換掉匹配到的子字符串，從而實現刪除類名的目的。
removeAttribute與removeAttributeNode方法異同
removeAttribute
移除節點指定名稱的屬性。示例如下
|
1
|
document.getElementById('riskTypePie').removeAttribute("style"); |
removeAttributeNode
注：此方法不兼容IE。
使用方法：
- 獲取要刪除屬性的元素
- 獲取該元素要刪除的屬性
- <元素>.removeAttributeNode<屬性>
|
1
2
3
|
var node=document.getElementById('chartWrap');var attr=n.getAttributeNode('style');node.removeAttributeNode(attr); |
異同分析
相同點
- 兩個方法都是用來移除節點屬性
- 兩種方法調用者都只能是標簽節點
不同點
- removeAttribute方法接收的是要刪除屬性的名字
- removeAttributeNode方法接收的是要刪除的屬性節點它本身
到此這篇關于JS removeAttribute()方法實現刪除元素的某個屬性的文章就介紹到這了,更多相關JS removeAttribute()刪除元素屬性內容請搜索服務器之家以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持服務器之家！
原文鏈接：http://c.biancheng.net/view/5925.html
