First, let's look at a simple document tree.
Obviously, the top-level node of the tree is a NodeA node. Next, you can move the node to any point in the tree by specifying the appropriate node. In combination with the following code, you can better understand the relationship between nodes in the tree:
NodeA. firstChild = NodeA1
NodeA. lastChild = NodeA3
NodeA. childNodes. length = 3
NodeA. childNodes [0] = NodeA1
NodeA. childNodes [1] = NodeA2
NodeA. childNodes [2] = NodeA3
NodeA1.parentNode = NodeA
NodeA1.nextSibling = NodeA2
NodeA3.prevSibling = NodeA2
NodeA3.nextSibling = null
NodeA. lastChild. firstChild = NodeA3a
NodeA3b. parentNode. parentNode = NodeA
DOM definition provides practical methods for operating the node Structure of a document object. It provides common methods such as executing object insertion, update, deletion, and cloning.
InsertBefore ()-Insert a new subnode before referring to the subnode. If the subnode referenced is null, the new subnode is inserted as the last subnode of the call node.
ReplaceChild () -- replace oldChild with the specified newChild in the childNodes set. If the replacement is successful, oldChild is returned. If newChild is null, you only need to delete oldChild.
RemoveChild () -- deletes the node specified by removeChild from the node's ChildNodes set. If the node is deleted successfully, the deleted child node is returned.
AppendChild () -- Add a new node to the end of the childNodes set. If yes, the new node is returned.
CloneNode () -- creates a new and replicated node. If the input parameter is true, the child node is also copied. If the node is an element, the corresponding attributes are also copied, return the new node.
To access or create a new node in a document tree, you can use the following methods:
GetElementById ()
GetElementsByTagName ()
CreateElement ()
CreateAttribute ()
CreateTextNode ()
Note: There is only one document object on a page. Except getElementsByTagName (), other methods can only be called through document. methodName.
Let's look at the following example:
This is a sample paragraph.