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 相关文章推荐
js读写cookie实现一个底部广告浮层效果的两种方法
Dec 29 Javascript
javascript设计模式之工厂模式示例讲解
Mar 04 Javascript
JavaScript获取图片真实大小代码实例
Sep 24 Javascript
node.js中的events.emitter.removeListener方法使用说明
Dec 10 Javascript
深入分析下javascript中的[]()+!
Jul 07 Javascript
纯js实现瀑布流布局及ajax动态新增数据
Apr 07 Javascript
详解JavaScript中双等号引起的隐性类型转换
May 30 Javascript
React Native实现简单的登录功能(推荐)
Sep 19 Javascript
BootStrap中
Dec 10 Javascript
Vue跨域请求问题解决方案过程解析
Aug 07 Javascript
vue路由的配置和页面切换详解
Sep 09 Javascript
json.stringify()与json.parse()的区别以及用处
Jan 25 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
WordPress中编写自定义存储字段的相关PHP函数解析
2015/12/25 PHP
CI框架入门之MVC简单示例
2016/11/21 PHP
JavaScript高级程序设计 读书笔记之八 Function类及闭包
2012/02/27 Javascript
什么是json和jsonp,jQuery json实例详详细说明
2012/12/11 Javascript
解读JavaScript中 For, While与递归的用法
2013/05/07 Javascript
使用js的replace()方法查找字符示例代码
2013/10/28 Javascript
JavaScript中的Web worker多线程API研究
2014/12/06 Javascript
使用bootstrap typeahead插件实现输入框自动补全之问题及解决办法
2016/07/07 Javascript
Javascript中引用类型传递的知识点小结
2017/03/06 Javascript
vue父组件中获取子组件中的数据(实例讲解)
2017/09/27 Javascript
JS 中使用Promise 实现红绿灯实例代码(demo)
2017/10/20 Javascript
vue数据操作之点击事件实现num加减功能示例
2019/01/19 Javascript
Django模板继承 extend标签实例代码详解
2019/05/16 Javascript
JS获取表格视图所选行号的ids过程解析
2020/02/21 Javascript
Node.js Domain 模块实例详解
2020/03/18 Javascript
Ant Design Vue table中列超长显示...并加提示语的实例
2020/10/31 Javascript
vue3.0自定义指令(drectives)知识点总结
2020/12/27 Vue.js
python获得两个数组交集、并集、差集的方法
2015/03/27 Python
Python闭包实现计数器的方法
2015/05/05 Python
Python容器使用的5个技巧和2个误区总结
2019/09/26 Python
Python Django路径配置实现过程解析
2020/11/05 Python
浅析HTML5中的download属性使用
2019/03/13 HTML / CSS
波兰运动鞋网上商店:e-Sporting
2018/02/16 全球购物
家庭睡衣和家庭用品:Little Blue House
2018/03/18 全球购物
墨西哥巴士车票在线购买:ClickBus
2018/03/27 全球购物
英国川宁茶官方网站:Twinings茶
2019/05/21 全球购物
Windows和Linux动态库应用异同
2016/07/28 面试题
介绍一下你对SOA的认识
2016/04/24 面试题
应届生会计电算化求职信
2013/10/03 职场文书
四议两公开实施方案
2014/03/28 职场文书
社区矫正工作方案
2014/06/04 职场文书
企业挂职心得体会
2014/09/10 职场文书
2014年护士工作总结范文
2014/11/11 职场文书
同学会邀请函模板
2015/01/30 职场文书
Feign调用全局异常处理解决方案
2021/06/24 Java/Android
Python中的pprint模块
2021/11/27 Python