Heim > Web-Frontend > js-Tutorial > Hauptteil

So löschen Sie untergeordnete Knotenattribute in Javascript

醉折花枝作酒筹
Freigeben: 2021-06-15 09:11:15
Original
2335 Leute haben es durchsucht

在javascript中,可以使用removeAttribute方法删除子节点属性,语法格式为“removeAttribute(元素的属性名)”。removeAttribute方法删除指定的属性。

So löschen Sie untergeordnete Knotenattribute in Javascript

本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。

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

removeAttribute(name)
Nach dem Login kopieren

参数 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>
Nach dem Login kopieren

在上面示例中设计了两个按钮,并分别绑定了不同的事件处理函数。单击“删除”按钮即可调用表格的 removeAttribute() 方法清除表格边框,单击“恢复”按钮即可调用表格的 setAttribute() 方法重新设置表哥便可的粗细。

示例2

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

<script>
  function hasClass (element, className) { //类名检测函数
    var reg = new RegExp (&#39;(\\s|^)&#39; + className + &#39;(\\s|$)&#39;);
    return reg.test (element, className); //使用正则检测是否有相同的样式
  }
  function deleteClass (element, className) {
    if (hasClass (element, className)) {
      element.className.replace (reg, &#39; &#39;); //捕获要删除样式,然后替换为空白字符串
    }
  }
</script>
<p id="red" class="red blue bold">盒子</p>
<script>
  var red = document.getElementById ("red");
  deleteClass (red, &#39;blue&#39;);
</script>
Nach dem Login kopieren

上面代码使用正则表达式检测 className 属性值字符串中是否包含指定的类名,如果存在,则使用空字符串替换掉匹配到的子字符串,从而实现删除类名的目的。

removeAttribute与removeAttributeNode方法异同

removeAttribute

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

document.getElementById(&#39;riskTypePie&#39;).removeAttribute("style");
Nach dem Login kopieren

removeAttributeNode

注:此方法不兼容IE。

使用方法:

  • 获取要删除属性的元素

  • 获取该元素要删除的属性

  • <元素>.removeAttributeNode<属性>

var node=document.getElementById(&#39;chartWrap&#39;);
var attr=n.getAttributeNode(&#39;style&#39;);
node.removeAttributeNode(attr);
Nach dem Login kopieren

异同分析

相同点

  • 两个方法都是用来移除节点属性

  • 两种方法调用者都只能是标签节点

不同点

  • removeAttribute方法接收的是要删除属性的名字

  • removeAttributeNode方法接收的是要删除的属性节点它本身

  • javascript动态添加、修改、删除对象的属性与方法详解

【推荐学习:javascript高级教程

Das obige ist der detaillierte Inhalt vonSo löschen Sie untergeordnete Knotenattribute in Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
js
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage