JS removeAttribute()方法实现删除元素的某个属性_js教程

JS removeAttribute()方法实现删除元素的某个属性

2021-12-30 16:11C语言中文网 js教程

这篇文章主要介绍了JS removeAttribute()方法实现删除元素的某个属性，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧

在 JavaScript 中，使用元素的 removeAttribute() 方法可以删除指定的属性。用法如下：
removeAttribute(name)

参数 name 表示元素的属性名。

示例1

下面示例演示了如何动态设置表格的边框。

				?

									<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

下面示例演示了如何自定义删除类函数，并调用该函数删除指定类名。

				?

									<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

移除节点指定名称的属性。示例如下

				?

									document.getElementById('riskTypePie').removeAttribute("style");

removeAttributeNode
注：此方法不兼容IE。

使用方法：

获取要删除属性的元素
获取该元素要删除的属性
<元素>.removeAttributeNode<属性>

				?

									var node=document.getElementById('chartWrap');

									var attr=n.getAttributeNode('style');

									node.removeAttributeNode(attr);