信鸽网

JavaScript实现向OL列表内动态添加LI元素的方法

  作者：bea

本文实例讲述了JavaScript实现向OL列表内动态添加LI元素的方法。分享给大家供大家参考。具体分析如下： JavaScript向OL列表内动态添加LI元素的方法，下面JS代码每次点击按钮都会想OL列表中动态添加一个LI <script type="text/javascript">function addItem() { var myitem = document.getElementById("ItemToAdd").value; var mylist

本文实例讲述了JavaScript实现向OL列表内动态添加LI元素的方法。分享给大家供大家参考。具体分析如下：


JavaScript向OL列表内动态添加LI元素的方法，下面JS代码每次点击按钮都会想OL列表中动态添加一个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>


希望本文所述对大家的javascript程序设计有所帮助。




有用  |  无用

猜你喜欢

您可能感兴趣的文章: