Heim > Artikel > Web-Frontend > Zusammenfassung exklusiver Attributinstanzen von Javascript-Dom-Objekten

Zusammenfassung exklusiver Attributinstanzen von Javascript-Dom-Objekten

伊谢尔伦Original: 2017-07-21 13:10:211457Durchsuche

Exklusive Attribute beziehen sich auf die Attribute, die für ein bestimmtes Tag einzigartig sind. Beispielsweise verfügt das Tag 3499910bf9dac5ae3c52d5ede7383485 über die Attribute href und target. a1f02c36ba31691bcfe87b2722de723b hat das src-Attribut; ff9c23ada1bcecdd1a0fb5d5a0f18437 hat die entype- und action-Attribute...

a_element.href Gibt den Hyperlink zurück, auf den der aktuelle Knoten zeigt

Werfen wir einen Blick auf die am häufigsten verwendeten allgemeinen Methoden:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    .form_style{
      color: #5b5b5b;
      font-size: large;
    }
    p {
      color: #5b5b5b;
      font-size: larger;
    }
  </style>

</head>


<body>
  <form id=&#39;first_form&#39; class="form_style" name="cangjingge" >
    请选择功法：<br/>
    <input type="radio" name="gongfa" value="jysg">九阳神功<br/>
    <input type="radio" name="gongfa" value="qkdny">乾坤大挪移<br/>
    <input type="radio" name="gongfa" value="khbd">葵花宝典<br/>
    <input type="radio" name="gongfa" value="xxdf">吸星大法<br/>
  </form>
  <p>少侠请三思！！！</p>

  <script>
    //js演示代码请添加至此
    
  </script>

</body>


</html>

1 element.appendChild(nodeName) Fügen Sie neue Elemente zu den Elementen hinzu. Der untergeordnete Knoten von , als letzter untergeordneter Knoten, und gibt diesen untergeordneten Knoten zurück. Um dem HTML-DOM ein neues Element hinzuzufügen, müssen Sie zunächst das Element erstellen und es dann an ein vorhandenes Element anhängen.

js-Democode:

var a=document.getElementById(&#39;first_form&#39;);   
var textnode=document.createTextNode("慎重选择");  
a.appendChild(textnode)

2 element.getAttribute(para) Elementknoten zurückgeben Der angegebene Attributwert.

js-Democode:

var a=document.getElementById(&#39;first_form&#39;);
console.log(a.getAttribute(&#39;name&#39;))      //控制台输出name的值

3 element.getAttributeNode(para) Gibt das angegebene zurück Attributknoten.

js-Democode:

var a=document.getElementById(&#39;first_form&#39;);
console.log(a.getAttributeNode(&#39;name&#39;))      //控制台输出name属性节点

4 element.getElementsByTagName(para) Gibt den angegebenen zurück Die Sammlung aller untergeordneten Elemente des Tag-Namens.

js-Democode:

var a=document.getElementById(&#39;first_form&#39;);
console.log(a.getElementsByTagName(&#39;input&#39;))      //控制台输出

5 element.hasAttribute(para) Wenn das Element has Wenn das Attribut angegeben ist, wird true zurückgegeben, andernfalls wird false zurückgegeben.

js-Democode:

var a=document.getElementById(&#39;first_form&#39;);
console.log(a.hasAttribute(&#39;name&#39;))      //控制台输出

6 element.insertBefore(insertNode,appointedNode) in Fügt einen neuen Knoten vor dem angegebenen vorhandenen untergeordneten Knoten ein.

js-Democode:

var a=document.getElementById(&#39;first_form&#39;);
    var inputList=document.getElementsByTagName(&#39;input&#39;);
    var newNode=document.createElement(&#39;input&#39;);
    var newNode2=document.createTextNode(&#39;天马流星拳&#39;);
    var br=document.createElement(&#39;br&#39;);
    newNode.type=&#39;radio&#39;;
    newNode.name=&#39;gongfa&#39;;
    newNode.value=&#39;tmlxq&#39;;
    a.insertBefore(newNode,inputList[2]);
    a.insertBefore(newNode2,inputList[3]);
    a.insertBefore(br,inputList[3]);

7 element.removeAttribute() Bewegen Sie sich vom Element Mit Ausnahme der angegebenen Attribute.

js-Beispielcode:

var a=document.getElementById(&#39;first_form&#39;);
a.removeAttribute(&#39;name&#39;);
console.log(a.hasAttribute(&#39;name&#39;))

8 element.removeChild() Aus dem Element entfernen Untergeordnete Knoten entfernen. Obwohl sich der entfernte Knoten nicht mehr im Dokumentbaum befindet, befindet er sich immer noch im Speicher und kann jederzeit referenziert werden.

js-Beispielcode:

var a=document.getElementById(&#39;first_form&#39;);
    a.removeChild(a.childNodes[3]);

9 element.replaceChild(newNode,replaceNode) Ersetzt den angegebenen Knoten durch einen neuen Knoten.

10 element.setAttribute(attrName,attrValue) Das angegebene Attribut auf den angegebenen Wert setzen oder ändern.

js-Beispielcode:

var a=document.getElementById(&#39;first_form&#39;);
    a.setAttribute(&#39;name&#39;,&#39;shaolinsi&#39;);
    console.log(a.name)

11 element.setAttributeNode() Ändern Sie das angegebene Attribut Knoten

js-Beispielcode:

var a=document.getElementById(&#39;first_form&#39;);
    var attr = document.createAttribute(&#39;id&#39;);
    attr.value=&#39;the_first&#39;;
    a.setAttributeNode(attr);
　　　　 console.log(a.id)

12 nodelist.item() Return NodeList lokalisiert in Geben Sie den Knoten am Index an.

js-Beispielcode:

var a=document.getElementsByTagName(&#39;input&#39;)
console.log(a.item(2))

Das obige ist der detaillierte Inhalt vonZusammenfassung exklusiver Attributinstanzen von Javascript-Dom-Objekten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

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

Vorheriger Artikel：Detaillierte Code-Erklärung, wie Javascript die Attributwerte eines Objekts durchläuftNächster Artikel：Detaillierte Code-Erklärung, wie Javascript die Attributwerte eines Objekts durchläuft

In Verbindung stehende Artikel

Mehr sehen