JS operation DOM node

Recent learning Vue,Vue Auto resolve template , It is found that there is no node operation , But often a case may be used js, And Vue Think in contrast , Study , But actually js The node operation is almost forgotten , Learn from today and review again .

The first category Operate through the element type method :( This method is used most )

 

document.getElementById();//id name ,
document.getElementsByTagName();// Tag name
document.getElementsByClassName();// Class name
document.querySelector();// Returns the first element that matches the pattern , The result is an element ;
document.querySelectorAll()// Returns all elements that match the pattern , The result is an array of classes

The second category ( Generally, it refers to the acquisition of relationship element nodes after element acquisition )

parentNode// Gets the parent of the selected node , The top node is #document
childNodes // Get the children of the selected node  
firstChild // Get the first child of the selected node
lastChild // Gets the last child of the selected node
nextSibling // Gets the next sibling of the selected node   
previousSibling // Get the previous node   

 

Correct the mistakes