Shulou(Shulou.com)06/03 Report--

Editor to share with you the example analysis of DOM nodes in HTML, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

In HTML DOM, everything is a node. A DOM is a HTML that is regarded as a node tree.

DOM node

According to the W3C HTML DOM standard, everything in an HTML document is a node:

The entire document is a document node

Each HTML element is an element node

The text within the HTML element is a text node

Each HTML attribute is an attribute node

Comments are comment nodes

HTML DOM node tree

HTML DOM treats HTML documents as tree structures. This structure is called a node tree:

HTML DOM Tree instance

With HTML DOM, all nodes in the tree are accessible through JavaScript. All HTML elements (nodes) can be modified, or nodes can be created or deleted.

Node parents, children and siblings

The nodes in the node tree have hierarchical relationships with each other.

Terms such as parent, child, and sibling are used to describe these relationships. The parent node has child nodes. Sibling child nodes are called siblings (brothers or sisters).

In the node tree, the top node is called the root

Every node has a parent node, except for the root (it has no parent node)

A node can have any number of children

A sibling is a node with the same parent node

The following picture shows part of the node tree and the relationship between the nodes:

Look at the following HTML snippet:

DOM tutorial

The first lesson of DOM

Hello world!

From the HTML above:

The node has no parent node; it is the root node

The parent node of and is a node

Text node "Hello world!" The parent node of is

Node

And:

The node has two child nodes: and

The node has a child node: the node

The node also has a child node: the text node "DOM tutorial"

And

A node is not only a sibling node, but also a child node

And:

An element is the first child node of an element

The element is the last child node of the element

An element is the first child node of an element

The element is the last child node of the element

Warning!

A common mistake in DOM processing is to expect the element node to contain text.

In this example: DOM tutorials, element nodes, containing text nodes with the value "DOM tutorials".

The value of the text node can be accessed through the innerHTML property of the node.

The above is all the content of the article "sample Analysis of DOM nodes in HTML". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.