Home > Developer > JavaScript
DOM node replacement or modification function replaceChild () usage instance, domreplacechild
This example describes how to replace or modify the replaceChild () function of a DOM node. Share it with you for your reference. The specific analysis is as follows:
DOM node replacement process:
(1) create a new node;
(2) Find the old node;
(3) from the perspective of the parent node, replaceChild (new, old) function is used for replacement.
Copy codeThe Code is as follows: <Head>
<Script type = "text/javascript">
Function t (){
// Train of thought: 1. First find the node to be replaced; 2. Create a new node; 3. Find the parent node and call the replaceChild (new or old) method from the perspective of the parent node.
Var newli = document. createElement ('lil'); // create a node
Var newtext = document. createTextNode ('day'); // create a text node
Newli. appendChild (newtext );
Var nodeul = document. getElementsByTagName ('ul ') [0]; // locate the parent node
Var oldli = nodeul. children [2]; // locate the node to be replaced
Nodeul. replaceChild (newli, oldli); // replace
}
</Script>
</Head>
<Body>
<Div id = "container">
<Ul>
<Li> spring </li>
<Li> summer </li>
<Li> blue sky </li>
<Li> autumn </li>
<Li> Winter </li>
</Ul>
</Div>
<Div id = "copyul">
</Div>
<Hr/>
<Button onclick = "t ()" value = ""> node replacement and modification </button>
</Body>
</Html>
I hope this article will help you design javascript programs.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
