document.createElement() usage_javascript skills

document.createElement() creates an object within an object and should be used in conjunction with the appendChild() or insertBefore() methods. Among them, the appendChild() method adds a new child node at the end of the node's child node list. The insertBefore() method inserts a new node at any position in the node's child node list.

The following is an example of how to use document.createElement().

Example 1:

Copy code The code is as follows:

   

Effect: Load a drop-down list box in the label board, with the attribute values ​​​​"Add-in 1" and "Add-in 2".

Example 3:

Copy code The code is as follows:

   

Through the above code, you can test that a new node is created under the node div, and this node is the last node of the div. Obviously, through this example, we can know that both appendChildhild and insertBefore can insert nodes.

In the above example, there is this code: oTest.insertBefore(newNode,null). Here insertBefore has two parameters that can be set. The first one is the same as appendChild, but the second one is unique to it. Not only can it be null, but it can also be:

Copy code The code is as follows:

Effect: This example will insert a new node in front of the x1 node

Or:

Copy code The code is as follows:

Effect: This example will insert a new node in front of the next node of the x1 node

Also:

Copy code The code is as follows:

This example will insert a new node in front of the first child node. You can also insert new nodes at other locations by changing childNodes[0,1,...]

Since it can be seen that the insertBefore() method is to insert a new node in front of the existing child node, but in Example 1, the insertBefore() method can also be used to insert a new node at the end of the child node list. Combining the two situations, it is found that the insertBefore() method can insert a node at any position in the child node list.

From these examples:

The appendChild() method adds a new child node to the end of the node’s child node list.
　insertBefore() method inserts a new node at any position in the node's child node list.