Htmldom node operations (get/modify/add or delete) _ javascript skills

DOM is a standard for getting, modifying, adding, or deleting HTML elements. The following describes how to operate htmldom nodes, for more information about how to obtain, modify, add, or delete HTML elements, see html dom. In html dom, everything is a node. DOM is the HTML of the node tree.

According to W3C html dom standards, all content in HTML documents is node:

The entire document is a document Node
Each HTML element is an element node.
The text in the HTML element is a text node.
Each HTML attribute is an attribute node.
Annotation is a comment node.

Html dom treats HTML documents 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 html dom, all nodes in the tree can be accessed through JavaScript. All HTML elements (nodes) can be modified or created or deleted.

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

I. method for getting element nodes:

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

2. var nodelist = document. getElementsByClassName ("nodeclassname ");

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

2. operations that can be performed on an element node: 1. operations on the element node. 2. subnode operations. 3. Operations on sibling nodes. 4. operations on the parent node

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

2. Determine whether a subnode exists: var boolean = node. hasChildNodes ();

Obtain the subnode list: var childList = node. childNodes;

Obtain the node element type: var nodetype = node. nodeType; var nodename = node. nodeName;

Delete a subnode. Node. removeChild (childNode );

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

Do not insert a subnode in the subnode: node. insertBefore (childNode );

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

2.3.node.nextSibling

Node. previussibling

2.4. Obtain the parent node. parentNode