1.
<! DOCTYPE html>
<body>
<ul id= "MyList" ><li>Coffee</li><li>Tea</li></ul>
<p id= "Demo" > click the button to add an item to the list. </p>
<button onclick= "myFunction ()" > Try it Yourself </button>
<script>
function MyFunction ()
{
var node=document.createelement ("LI");
var textnode=document.createtextnode ("Water");
Node.appendchild (Textnode);
At this point, node is <li>Water</li>
(I don't know why the AppendChild method can append text into a tag.)
document.getElementById ("MyList"). appendchild (node);
}
</script>
<p><b> Note:</b> First create the Li node, then create the text node and append the text node to the Li node. Finally, add the LI node to the list. </p>
</body>
2.
<! DOCTYPE html>
<body>
<ul id= "MyList1" ><li>Coffee</li><li>Tea</li></ul>
<ul id= "MyList2" ><li>Water</li><li>Milk</li></ul>
<p id= "Demo2" >demo2</p>
<p id= "Demo" > click the button to move the item from one list to another. </p>
<button onclick= "myFunction ()" > Try it Yourself </button>
<script>
function MyFunction ()
{
var Node=document.getelementbyid ("MyList2"). LastChild;
It's like cutting <li>Milk</li> out here.
Console.log (node);
document.getElementById ("Demo2"). appendchild (node);
And then append it to this place.
}
</script>
</body>
---------------------------------------------above from the W3school "HTML DOM appendchild () method" section
HTML DOM appendchild () method
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
