This article illustrates how JavaScript implements dynamically adding Li elements to the ol list. Share to everyone for your reference. The specific analysis is as follows:
JavaScript to the OL list of dynamic Add Li element method, the following JS code each Click button will think OL list dynamically add an Li
<script type= "Text/javascript" >
function AddItem () {
var myitem = document.getElementById ("Itemtoadd") . value;
var mylistitems = document.getElementById ("MyList");
var newp = document.createelement ("li");
var textnode = document.createTextNode (myitem);
Newp.appendchild (textnode);
document.getElementById ("MyList"). AppendChild (NEWP);
return false;
}
</script>
<form onsubmit= "return AddItem ()" action= "#" >
<span>grocery Items:</span >
<input type= "text" id= "Itemtoadd" value= "Milk"/> <input type=
"button" value= "Add" onclick= " AddItem () "/>
</form>
<span>grocery list:</span>
<ol id=" MyList Ol>
I hope this article will help you with your JavaScript programming.