JavaScript实现向OL列表内动态添加LI元素的方法
更新时间：2015年03月21日 11:17:19 作者：work24
这篇文章主要介绍了JavaScript实现向OL列表内动态添加LI元素的方法,实例分析了javascript操作html元素的技巧,需要的朋友可以参考下
本文实例讲述了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程序设计有所帮助。
相关文章
这篇文章主要介绍了json字符串对象转换代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2019-09-09
Auntion-TableSort javascript类文件
Auntion-TableSort javascript类文件...2007-11-11
这篇文章主要介绍了js 将多个对象合并成一个对象 assign方法的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-09-09
最近在做web项目，碰到需要跨页面传递参数的功能，就是那种需要把当前页面的内容带到新开的子窗体中，以前的做法是传一个id过去，然后在新窗口中去读数据库的内容;比较有意思的是直接通过调用form的submit方法不能触发onsubmit事件，查看了帮助文档，必须手动的触发，否则只能看到页面刷新而没有打开新窗口2012-12-12
这篇文章主要介绍了JS中解决谷歌浏览器记住密码输入框颜色改变功能,非常不错，具有参考借鉴价值，需要的朋友可以参考下2017-02-02
使用JavaScript操作Visual Viewport的方法示例
在现代前端开发中,视口（viewport）是一个非常重要的概念,它决定了用户在浏览网页时所看到的内容,JavaScript 提供了一个强大的接口 —— Visual Viewport API,让开发者可以更灵活地控制和获取视口的信息,本文将详细介绍如何使用 Visual Viewport API2024-09-09
这篇文章主要介绍了JS内部事件机制之单线程原理，本文给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下2018-07-07
JS基于递归算法实现1,2,3,4,5,6,7,8,9倒序放入数组中的方法
这篇文章主要介绍了JS基于递归算法实现1,2,3,4,5,6,7,8,9倒序放入数组中的方法,涉及JS递归算法操作数组实现排序功能的相关技巧,需要的朋友可以参考下2017-01-01
JavaScript异步调用定时方法并停止该方法实现代码 ，需要的朋友可以参考下2012-03-03
这篇文章主要介绍了JS中substring与substr的用法讲解，非常不错，具有参考借鉴价值，感兴趣的朋友一起看看吧2016-11-11
最新评论