What is the difference between node and element in DOM

The difference between node and element: 1. Node is a node, which contains different types of nodes, and Element is just a type of Node node; 2. Element inherits from Node, has the methods of Node, and also expands Many of their own unique methods.

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

We often use document.getElementById to get elements in the DOM, and we also use childNodes to get child nodes. So what is the difference between Element and Node?

The nodes provided by Node and the nodes provided by Element

When learning jQuery, do you always confuse Node and Eleme

Node on the left/Element on the right

The relationship between Node and Element

The relationship between Node and Element may be much clearer when thinking about inheritance.

Element inherits from Node, has Node's methods, and also expands many of its own unique methods.

In some methods of Element, Node and Element are clearly distinguished

For example: childNodes and children, parentNode and parentElement and other methods.

Some methods of Node, the return value is Node, such as text sections, comment nodes, etc., while some methods of Element, the return value must be Element.
If you distinguish this clearly, you can avoid many low-level problems.

Simply put, Node is a base class, and Element, Text and Comment in DOM all inherit from it.
In other words, Element, Text and Comment are three special Nodes, which are called ELEMENT_NODE,
TEXT_NODE and COMMENT_NODE respectively.

So the element on html that we usually use, namely Element, is a Node of type ELEMENT_NODE.

Summary:

• Node is a node, which contains different types of nodes, and Element is just a type of Node node.

• Element inherits from Node and can call Node's methods.

• To add methods to all DOM elements, you only need to pollute the prototype chain of Node or Element.

Node here refers to the DOM node, which includes our most common element nodes, such as div/p/span and the like. In addition, nodes such as Document/Comment are also included.
The type of a node can be viewed through its nodeType type. The specific type can be seen in the figure below:

[Related recommendations: JavaScript learning tutorial】

The above is the detailed content of What is the difference between node and element in DOM. For more information, please follow other related articles on the PHP Chinese website!