Dom Manipulation JS

1, getElementById ()//IE8 case insensitive

The Getelementsbyname ()//name property is not unique compared to the ID, and it is only in the form. Form elements. Img. is useful in the IFRAME, returning a nodelist array,

getElementsByTagName ()//return array

Getelementsbyclassname ()//SELECT elements based on CSS properties. Except IE8, the following are implemented

2. Select document features via CSS Selector

The following method is static compared to the above selection method and does not change as the document changes

Queryselectorall ("Div.middle")//Return a nodelist

Queryselector ()//returns the first matching element

3. Document node Tree:

ParentNode

ChildNodes FirstChild LastChild

NextSibling previourssibling previoussibling

nodetype//node type is an integer

Text content of Nodevalue//text or comment

nodename//tag name, uppercase

4. Document Element tree

Only element objects, regardless of text and annotations, are often more useful in the actual operation. Except for the IE4.

Children//nodelist

Firstelementchild Lastelementchild

Nextelementsibling previouselementsibling

Childelementcount

5. Set element properties

For standard attributes such as: ID, event, SRC, and so on. Assign a value directly with a property

For non-standard attributes: class, and so on. Use the following method:,

GetAttribute () SetAttribute () Hasattribute () RemoveAttribute ()

6element.textcontent//can be used to set plain text

7. Modify the document tree

Create node: document.createelement () createTextNode ()

Insert Node Parent.appendchild (chid) Parent.insertbefore (Child,parent.childnodes[n])//If the child is in the document that is present in the reception you, it will be broken to move. Remove its original location

8. Delete, copy, and replace nodes

RemoveChild CloneNode ReplaceChild

Dom Manipulation JS