js操纵dom生成下拉列表框的方法


Posted in Javascript onFebruary 24, 2014
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>利用dom生成下拉列表框</title> </head> 
<body onload="setFun()"> 
<form> 
<select name="area" id="area"> 
<option value="0">没有地区</option> 
</select> 
</form> 
<script language="javascript"> 
function setFun(){ 
var id = new Array(1,2,3); 
var value = new Array("贵州","重庆","四川"); 
var select = document.getElementById("area"); 
select.length = 1;//设置只能选择一个 
select.options[0].selected = true;//设置默认选中第一个 
for(var x = 0;x<id.length;x++){ 
var option = document.createElement("option"); 
option.setAttribute("value",id[x]);//设置option属性值 
option.appendChild(document.createTextNode(value[x])); 
select.appendChild(option);//向select增加option 
} 
} 
</script> 
</body> 
</html>
Javascript 相关文章推荐
JavaScript面向对象程序设计三 原型模式(上)
Dec 21 Javascript
parentElement,srcElement的使用小结
Jan 13 Javascript
JQuery调用WebServices的方法和4个实例
May 06 Javascript
jquery实现手机号码选号的方法
Jul 31 Javascript
js带缩略图的图片轮播效果代码分享
Sep 14 Javascript
javascript bom是什么及bom和dom的区别
Nov 26 Javascript
jQuery插件实现带圆点的焦点图片轮播切换
Jan 18 Javascript
js实现(全选)多选按钮的方法【附实例】
Mar 30 Javascript
老生常谈JavaScript 正则表达式语法
Aug 20 Javascript
javascript DOM的详解及实例代码
Mar 06 Javascript
input框中自动展示当前日期yyyy/mm/dd的实现方法
Jul 06 Javascript
js统计页面上每个标签的数量实例代码
May 29 Javascript
js设置function参数默认值(适合没有传参情况)
Feb 24 #Javascript
JS取request值以及自动执行使用示例
Feb 24 #Javascript
减少访问DOM的次数提升javascript性能
Feb 24 #Javascript
createTextRange()的使用示例含文本框选中部分文字内容
Feb 24 #Javascript
JavaScript 实现鼠标拖动元素实例代码
Feb 24 #Javascript
对table和ul实现js分页示例分享
Feb 24 #Javascript
jquery.post用法之type设置问题
Feb 24 #Javascript
You might like
PHP 5.0 Pear安装方法
2006/12/06 PHP
PHP 判断常量,变量和函数是否存在
2009/04/26 PHP
CI框架中libraries,helpers,hooks文件夹详细说明
2014/06/10 PHP
PHP的Yii框架中过滤器相关的使用总结
2016/03/29 PHP
Laravel Reponse响应客户端示例详解
2020/09/03 PHP
基于Jquery的跨域传输数据(JSONP)
2011/03/10 Javascript
如何让div span等元素能响应键盘事件操作指南
2012/11/13 Javascript
Firefox中通过JavaScript复制数据到剪贴板(Copy to Clipboard 跨浏览器版)
2013/11/22 Javascript
js中将String转换为number以便比较
2014/07/08 Javascript
Javascript的表单验证-揭开正则表达式的面纱
2016/03/18 Javascript
H5基于iScroll实现下拉刷新和上拉加载更多
2017/07/18 Javascript
Vue ElementUI之Form表单验证遇到的问题
2017/08/21 Javascript
HTML5开发Kinect体感游戏的实例应用
2017/09/18 Javascript
package.json配置文件构成详解
2019/08/27 Javascript
详解Vue 换肤方案验证
2019/08/28 Javascript
对layer弹出框中icon数字参数的说明介绍
2019/09/04 Javascript
JS实现星星海特效
2019/12/24 Javascript
nuxt 每个页面head标签内容设置方式
2020/11/05 Javascript
你不知道的SpringBoot与Vue部署解决方案
2020/11/09 Javascript
微信小程序自定义底部弹出框功能
2020/11/18 Javascript
[01:46]2018完美盛典章节片——坚守
2018/12/17 DOTA
python解析中国天气网的天气数据
2014/03/21 Python
Python运行DLL文件的方法
2020/01/17 Python
python中os.remove()用法及注意事项
2021/01/31 Python
css3个性化字体_动力节点Java学院整理
2017/07/12 HTML / CSS
介绍一下XMLHttpRequest对象
2012/02/12 面试题
工艺工程师工作职责
2013/11/23 职场文书
八一建军节活动方案
2014/02/10 职场文书
文化宣传方案
2014/03/13 职场文书
学位证书委托书
2014/09/30 职场文书
2014年为民办实事工作总结
2014/12/20 职场文书
2015年小学语文教师工作总结
2015/10/23 职场文书
《好妈妈胜过好老师》:每个孩子的优秀都是有源头的
2020/01/03 职场文书
在pycharm中无法import所安装的库解决方案
2021/05/31 Python
数据库之SQL技巧整理案例
2021/07/07 SQL Server
pandas数值排序的实现实例
2021/07/25 Python