The HTML dom node operates on of to get and modify and add or remove

  • 2020-03-30 01:25:59
  • OfStack

HTML DOM is the standard for how to get, modify, add, or remove HTML elements. In the HTML DOM, everything is a node. DOM is HTML that is treated as a tree of nodes.

According to the W3C's 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 inside an HTML element is a text node
Each HTML attribute is an attribute node
Comments are comment nodes

HTML DOM treats an HTML document as a tree structure. This structure is called a node tree:
HTML DOM Tree instance

http://www.w3school.com.cn/i/ct_htmltree.gif

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

All HTML elements are defined as objects, and the programming interface is object methods and object attributes.

1. Method of obtaining element node:

1. Var node = document. GetElementById (" nodeId ");

2. Var nodelist = document. GetElementsByClassName (" nodeclassname ");

3. Var nodelist = document. GetElementsByTagName (" nodetagname ");

Two: after we get the element node, we can operate on it: 1. Operation on itself. 2. Operations on child nodes. 3. Operation on brother nodes. 4. Operation on the parent node

2.1. Delete itself: node. ParentNode. RemoveChild (node);

Var Boolean = node.haschildnodes ();

Var childList = node.childNodes;

Var nodetype = node. nodetype; Var nodename = node. The nodename;

Delete child nodes. Node. RemoveChild (childNode);

Insert a childNode at the end of the childNode: node.appendchild (childNode);

Insert a childNode in the childNode :node. InsertBefore (childNode);

Replace B node with A node: node.replaceChild(A,B);

2.3.node.nextsibling gets the nextSibling node adjacent to it

Node. PreviousSibling gets the adjacent last sibling node

2.4. Get the parentNode node. ParentNode

Related articles: