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
1548 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!

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
Derniers numéros
c++ appelle javascript
Depuis 1970-01-01 08:00:00
0
0
0
Qu’est-ce que le garbage collection JavaScript ?
Depuis 1970-01-01 08:00:00
0
0
0
Que sont les fonctions de hook JavaScript ?
Depuis 1970-01-01 08:00:00
0
0
0
Comment obtenir la date actuelle en JavaScript ?
Depuis 1970-01-01 08:00:00
0
0
0
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal