Summary of exclusive attribute instances of javascript dom objects-JS Tutorial-php.cn

Summary of exclusive attribute instances of javascript dom objects

伊谢尔伦

Release： 2017-07-21 13:10:21

Original

1472 people have browsed it

Exclusive attributes refer to those attributes that are exclusive to a certain tag. For example, the tag has href and target attributes. has the src attribute;

has the entype and action attributes...

a_element.href Returns the hyperlink pointed to by the current node

Let’s take a look The more commonly used general method:

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

Copy after login

1 element.appendChild(nodeName) Add a new child to the element node as the last child node and returns that child node. To add a new element to the HTML DOM, you must first create the element and then append it to an existing element.

js demo code:

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

Copy after login

element.getAttribute(para) Returns the designation of the element node attribute value.

js demo code:

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

Copy after login

element.getAttributeNode(para) Returns the specified attribute node . js demo code:

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

Copy after login

element.getElementsByTagName(para)

Returns the specified tag name The collection of all child elements. js demo code:

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

Copy after login

element.hasAttribute(para)

If the element has the specified attribute , returns true, otherwise returns false. js demo code:

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

Copy after login

element.insertBefore(insertNode,appointedNode)

In the specified Insert new nodes before existing child nodes. js demo code:

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]);

Copy after login

element.removeAttribute()

Remove the specified element from the element Attributes. js sample code:

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

Copy after login

element.removeChild()

Remove the child from the element node. Although the removed node is no longer in the document tree, it is still in memory and can be referenced at any time. js sample code:

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

Copy after login

element.replaceChild(newNode,replaceNode)

Replace the specified node Replace with new node. 10 element.setAttribute(attrName,attrValue)

Set or change the specified attribute to the specified value. js sample code:

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

Copy after login

element.setAttributeNode()

Modify the specified attribute node

js sample code:

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)

Copy after login

nodelist.item()

Returns the node located at the specified subscript in the NodeList .

js sample code:

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

Copy after login

The above is the detailed content of Summary of exclusive attribute instances of javascript dom objects. For more information, please follow other related articles on the PHP Chinese website!