Home > Web Front-end > JS Tutorial > js---DOM node

js---DOM node

不言
Release: 2018-04-04 11:10:26
Original
1221 people have browsed it

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

How to operate DOM 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!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template