HTML DOM node operations (GET/modify/Add or delete) _javascript tips

The HTML DOM is the standard for how to get, modify, add, or delete HTML elements. In the HTML DOM, all things are nodes. The DOM is the HTML that is treated as a node tree.

All content in an HTML document is a node, based on the HTML DOM standard of the consortium:

The entire document is a document node
Each HTML element is an element node
Text within an HTML element is a text node
Each HTML attribute is an attribute node
Comments are annotation nodes

The HTML DOM sees an HTML document as a tree structure. This structure is called the node tree:
HTML DOM Tree Instance

Yun_qi_img/ct_htmltree.gif

Through the 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.

All HTML elements are defined as objects, while programming interfaces are object methods and object properties.

One: Get the element node method:

1.var node = document.getElementById ("NodeId");

2.var nodelist = Document.getelementsbyclassname ("Nodeclassname");

3.var nodelist = document.getElementsByTagName ("Nodetagname");

Two: After getting to the element node we can do the operation to him: 1. The operation of oneself. 2. Operation of child nodes. 3. The operation of the sibling node. 4. Actions on the parent node

2.1. Delete itself: node.parentNode.removeChild (node);

2.2. Determine whether there are child nodes: var Boolean = Node.haschildnodes ();

Get list of child nodes: var childlist = node.childnodes;

Gets the node element type: var NodeType = Node.nodetype; var nodename = Node.nodename;

Deletes a child node. Node.removechild (Childnode);

Inserts a child node at the tail of the child node: Node.appendchild (Childnode);

Do not insert a child node in a child node: Node.insertbefore (Childnode);

Replace B node with A node: Node.replacechild (A,B);

2.3.node.nextsibling gets the next sibling node

Node.previoussibling to get the neighboring previous sibling node

2.4. Get parent Node Node.parentnode