Dom
CreateElement (), createTextNode (), appendChild (), removeChild (), replaceChild (), insertBefore (), createDocumentFragment ()
// Create a node
Function CreatNode (){
Var oP = document. createElement ("p ");
OP. innerHTML = "<font style = 'color: red; '> Hello World! </Font> ";
Document. body. appendChild (oP );
}
// Delete a node
Function RemoveNode (){
Var oP = document. getElementsByTagName ("p ");
Var len = oP. length;
If (len! = 0 ){
OP [len-1]. parentNode. removeChild (oP [len-1]); // it is best to delete the node using the parentNode feature.
}
Else {
Alert ("all deleted! ");
}
}
// Replace the node
Function ReplaceNode (){
Var oNewP = document. createElement ("p ");
ONewP. innerHTML = "<font style = 'color: red; '> New --> Hello World! </Font> ";
// Replace the last added node with oNewP
Var len = document. getElementsByTagName ("p"). length;
Var oOldLastP = document. getElementsByTagName ("p") [len-1];
OOldLastP. parentNode. replaceChild (oNewP, oOldLastP );
}
// InsertBefore () method
Before a new message appears, two parameters are accepted:
1. the node to be added; 2. the node to be inserted before
Xxx. parentNode. insertBefore (newChild, oldChild );
// CreateDocumentFragment () method
Create document fragments
You can add ten new node elements to the File Fragment. Then, the fragment is passed as a parameter to the appendChild ()
Xxx. appendChild (oFragment );
In this way, xxx only calls once instead of 10 calls, improving performance.