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 相关文章推荐
firefox下对ajax的onreadystatechange的支持情况分析
Dec 14 Javascript
Grid得到选择行数据的方法总结
Jan 17 Javascript
js实现带搜索功能的下拉框实时搜索实时匹配
Nov 05 Javascript
jquery自定义表格样式
Nov 23 Javascript
jQuery获取checkbox选中的值
Jan 28 Javascript
JS字符串的切分用法实例
Feb 22 Javascript
jQuery+Ajax实现限制查询间隔的方法
Jun 07 Javascript
JS实现页面打印功能
Mar 16 Javascript
jQuery访问浏览器本地存储cookie、localStorage和sessionStorage的基本用法
Oct 20 jQuery
vue实现同一个页面可以有多个router-view的方法
Sep 20 Javascript
关于layui导航栏不展示下拉列表的解决方法
Sep 25 Javascript
vue首次渲染全过程
Apr 21 Vue.js
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
世界上第一台立体声收音机
2021/03/01 无线电
php获得文件扩展名三法
2006/11/25 PHP
php 归并排序 数组交集
2011/05/10 PHP
解析PHP实现多进程并行执行脚本
2013/06/18 PHP
深入分析PHP设计模式
2020/06/15 PHP
让Firefox支持event对象实现代码
2009/11/07 Javascript
jQuery EasyUI 中文API Layout(Tabs)
2010/04/27 Javascript
JS焦点图切换,上下翻转
2011/05/12 Javascript
node.js中的buffer.toString方法使用说明
2014/12/14 Javascript
jQuery中:lt选择器用法实例
2014/12/29 Javascript
JS解析XML实例分析
2015/01/30 Javascript
jquery图片切换插件
2015/03/16 Javascript
jQuery中on绑定事件后引发的事件冒泡问题如何解决
2016/05/25 Javascript
详解React-Todos入门例子
2016/11/08 Javascript
详解前端路由实现与react-router使用姿势
2017/08/07 Javascript
AngularJS 打开新的标签页实现代码
2017/09/07 Javascript
Three.js实现绘制字体模型示例代码
2017/09/26 Javascript
4个顶级JavaScript高级文本编辑器
2018/10/10 Javascript
vue实现百度下拉列表交互操作示例
2019/03/12 Javascript
js实现拾色器插件(ColorPicker)
2020/05/21 Javascript
深入分析在Python模块顶层运行的代码引起的一个Bug
2014/07/04 Python
Python 爬取携程所有机票的实例代码
2018/06/11 Python
详解python3中zipfile模块用法
2018/06/18 Python
python实现QQ批量登录功能
2019/06/19 Python
Python3 socket即时通讯脚本实现代码实例(threading多线程)
2020/06/01 Python
如何验证python安装成功
2020/07/06 Python
css3动画 小球滚动 js控制动画暂停
2019/11/29 HTML / CSS
英国健身专家:WIT Fitness
2021/02/09 全球购物
法学专业个人求职信
2013/09/26 职场文书
毕业生文员求职信
2013/11/03 职场文书
公务员年度考核评语
2014/12/31 职场文书
销售业务员岗位职责
2015/02/13 职场文书
应聘教师自荐信
2015/03/26 职场文书
2015秋季开学典礼主持词
2015/07/16 职场文书
Python编程super应用场景及示例解析
2021/10/05 Python
MySQL读取JSON转换的方式
2022/03/18 MySQL