The content of this article is the DOM node in js. I will share it with you here, and you can also refer to friends in need
1. Get elements:
1.getElementsByTagName ()----All browsers have this method, there is no compatibility problem
2.getElementById()---Below IE8.0, the Id is not case-sensitive, which means it is not compatible. Sexual issues
3.getElementsByClassName()---This method is not available below IE9.0, and there are compatibility issues.
4.getElementsByName()---name attribute, the name attribute of Input, not all tags are valid
5.querySelector('selector')---below IE8.0 Incompatible, the selected copy is a copy. When you modify the DOM in HTML, the previously selected copy will not change accordingly.
2. Traversal
Traverse the node tree: parentNode/childNodes/firstChild/lastChild/nextSibling/PreviousSibling---The node tree includes text nodes, comment nodes, and empty nodes
Traverse the element tree: Except for children, there are compatibility issues in all other IE9 and below
parentElement---the highest parent to html;
children---no compatibility issues, only Returns the element child node of the current element
node.childElementCount===node.children.lengthThe number of child elements of the current node
firstElementChild---returns the first element node ( IE is not compatible)
nextElementSibling/previousElementSibling
Type of node: call the node nodeType
Element node---1; Attribute node---2; Text node- --3; Annotation node---8; document---9; DocumentFragment---11
Prototype chain: document--->HTMLDocument.prototype--->Document.p rototype
Related recommendations:
How to operate DOM elements in js
Detailed explanation of DOM event flow in js
The above is the detailed content of js---DOM node. For more information, please follow other related articles on the PHP Chinese website!