DOM node operation with native JS

The DOM (Document Object model/) is an API for HTML and XML documents.
DOM node tree: spaces, carriage returns, labels, notes, text, doctype, labels, and so on are all part of the DOM node in the document.

The way to manipulate DOM nodes is to create, add (insert), remove, replace, find (get), and clone DOM nodes.

Create text node:var newtext = document.createtextnode (' text node ');
Create tag node:var newNode = document.createelement (' div ');

Add (insert) child node to end: parent node. appendchild (child node);
Add (insert) child nodes to a node before: parent node. InsertBefore (child node, a node);

Remove child nodes: parent node. RemoveChild (child node);

Replace node: parent node. ReplaceChild (replaced node, node before replacement);

Find (get) node:
find (GET) All child nodes: parent node. childNodes
find (GET) all child nodes that are label types: parent node. Children
find (Get) Next sibling node: a node. nextSibling
find (get) the previous sibling node: a node. previoussibling
Find (Get) parent node: child node. parentnode
find (GET) first child node: parent node. firstchild
find (GET) Last child node: parent node. LastChild

You can also use document.get ... method to get, detailed see: JS get Tag method and compatible processing