Maison > interface Web > js tutoriel > Résumé des instances d'attributs exclusifs des objets dom javascript

Résumé des instances d'attributs exclusifs des objets dom javascript

伊谢尔伦
Libérer: 2017-07-21 13:10:21
original
1496 Les gens l'ont consulté

Les attributs exclusifs font référence aux attributs qui sont uniques à une certaine balise. Par exemple, la balise possède les attributs href et target. a l'attribut src ;

a les attributs entype et action...

a_element.href Renvoie le lien hypertexte pointé par le nœud actuel

Jetons un coup d'oeil aux méthodes générales les plus couramment utilisées :


<!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>
Copier après la connexion

1 element.appendChild(nodeName) Ajouter de nouveaux éléments aux éléments Le nœud enfant de , en tant que dernier nœud enfant, et renvoie le nœud enfant. Pour ajouter un nouvel élément au DOM HTML, vous devez d'abord créer l'élément, puis l'ajouter à un élément existant.

Code de démonstration js :


var a=document.getElementById(&#39;first_form&#39;);   
var textnode=document.createTextNode("慎重选择");  
a.appendChild(textnode)
Copier après la connexion

2 element.getAttribute(para) Nœud d'élément de retour La valeur d'attribut spécifiée.

Code de démonstration js :


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

3 element.getAttributeNode(para) Renvoie le spécifié nœud d’attribut.

code de démonstration js :


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

4 element.getElementsByTagName(para) Renvoie le spécifié La collection de tous les éléments enfants du nom de la balise.

Code démo js :


var a=document.getElementById(&#39;first_form&#39;);
console.log(a.getElementsByTagName(&#39;input&#39;))      //控制台输出
Copier après la connexion

5 element.hasAttribute(para) Si l'élément has Si l'attribut est spécifié, true est renvoyé, sinon false est renvoyé.

code de démonstration js :


var a=document.getElementById(&#39;first_form&#39;);
console.log(a.hasAttribute(&#39;name&#39;))      //控制台输出
Copier après la connexion

6 element.insertBefore(insertNode,appointedNode) dans Insère un nouveau nœud avant le nœud enfant existant spécifié.

Code de démonstration js :


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]);
Copier après la connexion

7 element.removeAttribute() Déplacer depuis l'élément Sauf les attributs spécifiés.

exemple de code js :


var a=document.getElementById(&#39;first_form&#39;);
a.removeAttribute(&#39;name&#39;);
console.log(a.hasAttribute(&#39;name&#39;))
Copier après la connexion

8 element.removeChild() Supprimer de l'élément Supprimez les nœuds enfants. Bien que le nœud supprimé ne figure plus dans l'arborescence du document, il est toujours en mémoire et peut être référencé à tout moment.

exemple de code js :


var a=document.getElementById(&#39;first_form&#39;);
    a.removeChild(a.childNodes[3]);
Copier après la connexion

9 element.replaceChild(newNode,replaceNode) Remplace le nœud spécifié avec un nouveau nœud.

10 element.setAttribute(attrName,attrValue) Définissez ou modifiez l'attribut spécifié sur la valeur spécifiée.

exemple de code js :


var a=document.getElementById(&#39;first_form&#39;);
    a.setAttribute(&#39;name&#39;,&#39;shaolinsi&#39;);
    console.log(a.name)
Copier après la connexion

11 element.setAttributeNode() Modifier l'attribut spécifié node

exemple de code js :


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)
Copier après la connexion

12 nodelist.item() Retour NodeList localisé dans Spécifiez le nœud à l'index.

exemple de code js :


var a=document.getElementsByTagName(&#39;input&#39;)
console.log(a.item(2))
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal