动态添加option及createElement使用示例


Posted in Javascript onJanuary 26, 2014
<!DOCTYPE html> 
<html> 
<head> 
<title>select.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
<meta http-equiv="description" content="this is my page"> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<!--<link rel="stylesheet" type="text/css" href="./styles.css">--> 
</head> 
<body> 
<select id = "myCourse" onchange = "getCourse();"> 
<option value = "" selected>--请选择一门课程--</option> 
</select> 
<textarea id = "myares" rows="10" cols="30"></textarea> 
<script type="text/javascript" type = "text/javascript"> 
<!-- 
var last_select_num = 3;//加入从数据库中查询 
//动态添加第一门课程 
var myOption = document.createElement("option"); 
myOption.value = "java"; 
myOption.text = "java"; 
myCourse.add(myOption); 
//动态添加第二门课程、 
myOption = document.createElement("option"); 
myOption.value = "oracle"; 
myOption.text = "oracle"; 
myCourse.add(myOption); 
//动态添加第三门课程、 
myOption = document.createElement("option"); 
myOption.value = "javaEE"; 
myOption.text = "javaEE"; 
myCourse.add(myOption); 
function getCourse(){ 
myares.value += "你选择了:"+myCourse.value +"\r\n"; 
} 
--> 
</script> 
</body> 
</html>

动态添加option及createElement使用示例 
Javascript 相关文章推荐
css图片自适应大小
Nov 28 Javascript
一个简单的Node.js异步操作管理器分享
Apr 29 Javascript
JavaScript操作HTML元素和样式的方法详解
Oct 21 Javascript
轻松实现Bootstrap图片轮播
Apr 20 Javascript
js采用concat和sort将N个数组拼接起来的方法
Jan 21 Javascript
jquery实现界面无刷新加载登陆注册
Jul 30 Javascript
JavaScript new对象的四个过程实例浅析
Jul 31 Javascript
Vue 与 Vuex 的第一次接触遇到的坑
Aug 16 Javascript
nuxt中使用路由守卫的方法步骤
Jan 27 Javascript
react-native聊天室|RN版聊天App仿微信实例|RN仿微信界面
Nov 12 Javascript
js点击事件的执行过程实例分析【冒泡与捕获】
Apr 11 Javascript
nuxt.js写项目时增加错误提示页面操作
Nov 05 Javascript
js和jquery使按钮失效为不可用状态的方法
Jan 26 #Javascript
js中创建对象的几种方式示例介绍
Jan 26 #Javascript
Jquery创建层显示标题和内容且随鼠标移动而移动
Jan 26 #Javascript
js加入收藏以及使用Jquery更改透明度
Jan 26 #Javascript
JS对象转换为Jquery对象示例
Jan 26 #Javascript
JavaScript原型链示例分享
Jan 26 #Javascript
JS设置获取cookies的方法
Jan 26 #Javascript
You might like
php中namespace use用法实例分析
2016/01/22 PHP
PHP实现的随机红包算法示例
2017/08/14 PHP
有关javascript的性能优化 (repaint和reflow)
2013/04/12 Javascript
jQuery列表拖动排列具体实现
2013/11/04 Javascript
javascript实现的弹出层背景置灰-模拟(easyui dialog)
2013/12/27 Javascript
JS完整获取IE浏览器信息包括类型、版本、语言等等
2014/05/22 Javascript
分享一个自己动手写的jQuery分页插件
2014/08/28 Javascript
JavaScript原生对象之Number对象的属性和方法详解
2015/03/13 Javascript
原生js实现addClass,removeClass,hasClass方法
2016/04/27 Javascript
使用BootStrap实现表格隔行变色及hover变色并在需要时出现滚动条
2017/01/04 Javascript
JS中的phototype详解
2017/02/04 Javascript
webpack学习笔记之代码分割和按需加载的实例详解
2017/07/20 Javascript
Vue CLI3创建项目部署到Tomcat 使用ngrok映射到外网
2019/05/16 Javascript
vue中使用 pako.js 解密 gzip加密字符串的方法
2019/06/10 Javascript
微信小程序如何调用图片接口API并居中显示
2019/06/29 Javascript
vue中的v-if和v-show的区别详解
2019/09/01 Javascript
Python原始字符串(raw strings)用法实例
2014/10/13 Python
使用Python的Tornado框架实现一个一对一聊天的程序
2015/04/25 Python
Python实现栈的方法
2015/05/26 Python
Python实现配置文件备份的方法
2015/07/30 Python
Python 提取dict转换为xml/json/table并输出的实现代码
2016/08/28 Python
Python爬虫抓取代理IP并检验可用性的实例
2018/05/07 Python
Python字典循环添加一键多值的用法实例
2019/01/20 Python
python如何将多个PDF进行合并
2019/08/13 Python
python读取tif图片时保留其16bit的编码格式实例
2020/01/13 Python
python数据类型可变不可变知识点总结
2020/03/06 Python
宝塔面板成功部署Django项目流程(图文)
2020/06/22 Python
pytorch Dataset,DataLoader产生自定义的训练数据案例
2021/03/03 Python
HTML5跳转小程序wx-open-launch-weapp的示例代码
2020/07/16 HTML / CSS
Html5基于canvas实现电子签名并生成PDF文档
2020/12/07 HTML / CSS
微软新西兰官方网站:Microsoft New Zealand
2018/08/17 全球购物
大学本科生的个人自我评价
2013/12/09 职场文书
2014年优质护理服务工作总结
2014/11/14 职场文书
校长新学期致辞
2015/07/30 职场文书
西部计划志愿者工作总结
2015/08/11 职场文书
高中班长竞选稿
2015/11/20 职场文书