动态添加option及createElement使用示例

 动态添加option在某些特殊的情况下还是比较实用的，本文有个小示例为大家介绍下createElement使用，感兴趣的朋友可以参考下

 代码如下:
<!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 +"rn"; 
} 
--> 
</script> 
</body> 
</html> 
 

时间： 2024-12-30 07:03:46

动态添加option及createElement使用示例的相关文章

动态添加option及createElement使用示例_javascript技巧

复制代码 代码如下: <!DOCTYPE html> <html> <head> <title>select.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is

jquery动态添加option示例_jquery

jquery动态添加option js动态添加option 复制代码 代码如下: var sel= document.getElementById("Selected1"); sel.options.add(new Option("请选择",""));sel.options.add(new Option("name","id")); jquery动态添加option 复制代码 代码如下: $("#

利用js动态添加删除table行的示例代码

 本篇文章主要是对利用js动态添加删除table行的示例代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 如下所示:    代码如下: //动态添加行 function addRow(){    var table = document.getElementById("tableID");    var newRow = table.insertRow(); //创建新行    var newCell1 = newRow.insertCell(); //创建新单元格    

jquery动态添加option选项

 jquery动态添加option选项,还有动态删除的方法,大家参考使用吧 jquery动态添加option   js动态添加option 代码如下: var sel= document.getElementById("Selected1");  sel.options.add(new Option("请选择","")); sel.options.add(new Option("name","id"));

JS动态添加option和删除option(附实例代码)_javascript技巧

1.动态创建select 复制代码 代码如下: function createSelect(){ var mySelect = document.createElement("select"); mySelect.id = "mySelect"; document.body.appendChild(mySelect); } 2.添加选项option 复制代码 代码如下: function addOption(){ //根据id查找对象, var obj=docume

利用js动态添加删除table行的示例代码_javascript技巧

如下所示: 复制代码 代码如下: //动态添加行function addRow(){   var table = document.getElementById("tableID");   var newRow = table.insertRow(); //创建新行   var newCell1 = newRow.insertCell(); //创建新单元格   newCell.innerHTML = "": //单元格内的内容   newCell.setAttri

js动态添加删除,后台取数据(示例代码)_javascript技巧

环境描述:就像你一般在论坛上发表文章,可能带附件,附件的数量是你手动添加删除的!!/*************************************************************************** 添加审批表单模板************************************************************************/// 增长的索引var itemIndex = 1000;// 数量var counter = 0;/

JQuery动态添加Select的Option元素实现方法_jquery

如下所示: var selector=$('<select></select>'); for(var i=0;i<5;i++){ selector.append('<option value="'+i+'">'+i+'</option>'); } 以上这篇JQuery动态添加Select的Option元素实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持. 以上是小编为您精心准备的的内容,在的博客.问答

JS &amp; JQuery 动态添加 select option_javascript技巧

今天有朋友问我一个关于在<select>里动态添加option问题,一开始以为是JS那里动态添加,所以用了JS动态添加option的方法,但你那里是用JQuery的,所以才会一直出错,下面记下在JS和JQuery里添加option的区别. JS: var selid = document.getElementById("sltid"); for(var i=0; i<10;i++){ //循环添加多个值 sid.option[i] = new Option(i,i);