javascript为下拉列表动态添加数据项
更新时间：2014年05月23日 09:25:48 作者：
这篇文章主要介绍了javascript如何为下拉列表动态添加数据项,需要的朋友可以参考下
javascript为下拉列表添加数据项.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>为下拉列表动态添加数据项</title>
<script type="text/javascript">
function gel(id) { return document.getElementById(id); }
window.onload = function() {
var cbbYear = gel("mysel");
for (var i = 1990; i < 2014; i++) {
//方法1
/*var opt = document.createElement("option");
opt.innerHTML = i;
cbbYear.appendChild(opt);*/
//方法2
var opt = new Option(i, i);
cbbYear.options.add(opt);
}
};
</script>
</head>
<body>
<select id="mysel">
</select>
</body>
</html>
复制代码 代码如下:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>为下拉列表动态添加数据项</title>
<script type="text/javascript">
function gel(id) { return document.getElementById(id); }
window.onload = function() {
var cbbYear = gel("mysel");
for (var i = 1990; i < 2014; i++) {
//方法1
/*var opt = document.createElement("option");
opt.innerHTML = i;
cbbYear.appendChild(opt);*/
//方法2
var opt = new Option(i, i);
cbbYear.options.add(opt);
}
};
</script>
</head>
<body>
<select id="mysel">
</select>
</body>
</html>
相关文章
这篇文章主要介绍了js实现点击图片在屏幕中间弹出放大效果,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2019-09-09
在标题栏显示新消息提示，很多公司项目中用到这个方法,需要的朋友可以参考下。2011-11-11
这篇文章主要介绍了JS动态修改图片的URL（src）的方法,涉及javascript操作图片src属性的技巧,非常具有实用价值,需要的朋友可以参考下2015-04-04
用JS替换字符串时。只能替换掉字符串中第一个匹配对象,有时候需要替换全部的字符，下文是具体的实现方法，大家可以参考下2014-12-12
数组去重在面试和工作中都是比较容易见到的问题。这篇文章主要是来测试多个方法，对下面这个数组的去重结果进行分析讨论，需要的可以参考一下2022-07-07
这篇文章主要介绍了JS实现斐波那契数列的五种方式(小结)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-09-09
这篇文章主要介绍了微信小程序request请求封装，验签代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2019-12-12
ECMAScript 模块（ESM）是在 Web 中使用模块的规范， 所有现代浏览器均支持此功能，同时也是在 Web 中编写模块化代码的推荐方式，这篇文章主要介绍了Webpack ECMAScript 模块,需要的朋友可以参考下2023-12-12
JS实现集合的交集、补集、差集、去重运算示例【ES5与ES6写法】
这篇文章主要介绍了JS实现集合的交集、补集、差集、去重运算,结合实例形式分析了ES5与ES6语法环境下的集合常见运算操作技巧,需要的朋友可以参考下2019-02-02
JavaScript ECMA-262-3 深入解析（二）：变量对象实例详解
这篇文章主要介绍了JavaScript ECMA-262-3变量对象,结合实例形式详细分析了JavaScript ECMA变量对象相关概念、原理、用法及操作注意事项,需要的朋友可以参考下2020-04-04
最新评论