您的位置:首页 > 运维架构

输出所有select元素下的所有option元素中对应的文本内容

2013-06-02 18:25 501 查看


 输出所有select元素下的所有option元素中对应的文本内容, 例如:<option value="中专">中专^^</option>  输出--->中专^^

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <title>yuhan20081021</title>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

  </head>

  

  <body>
  <select name="edu" id="edu">
   <option value="博士">博士^^^^^</option>
 <option value="硕士">硕士^^^^^</option>
 <option value="本科" selected="selected" >本科^^^^^</option>
 <option value="幼儿园">幼儿园^^^^^</option>
  </select> 

  </body>

  

  【法一】<script language="JavaScript">

    //获取select元素的引用
var selectElement=document.getElementById("edu");

    //输出所有select元素下的所有option元素中对应的文本内容

         //例如:<option value="中专">中专^^</option>  输出--->中专^^

    var optionElements=selectElement.getElementsByTagName("option");

    for(var i=0;i<optionElements.length;i++){

      alert(optionElements[i].firstChild.nodeValue);
}

  </script>


【法二】

 <script language="JavaScript">

     //增加节点<option value="大专">大专^^^^^</option>

     var optionElement=document.createElement("option");
optionElement.setAttribute("value","大专");

     var textElement=document.createTextNode("大专^^^^^");   

     optionElement.appendChild(textElement);
var eduElement=document.getElementById("edu");
eduElement.appendChild(optionElement);   

  </script>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐