高手请进：一个关于select innerHTML; 的奇怪现象

我明明给document.all('tid').innerHTML的值是 "<option value='1' >测试一 </option > "
可是为什么我alert它的值时，却是"测试一 </option >",而且如果我给它赋值为:"aa <option value='1' >测试一 </option >"时，我再alert它的值时，它就是"aa <option value='1' >测试一 </option > "
是不是很奇怪呀?

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

select对象中只有option标签是合法的html标签，其余的都被认做为是textNode
要在select中创建option元素，使用如下方法select对象.列表[列表索引] = 一个新的列表(显示文字,值)selectObj.options[selectObj.length] = new Option("文本","值")
看看这个<html>
<head>
<title>List</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script LANGUAGE="javascript">

</script>
</head>
<body>
<form name="myform" method="post">
    <select name="biglocation" onChange="changelocation(document.myform.biglocation.options[document.myform.biglocation.selectedIndex].value)">
        <option value="00" selected>==请选择==</option>
        <option value="01">上海</option>
        <option value="02">江西</option>
    </select>
    <select name="smalllocation">
        <option selected value="">==所有地区==</option>
    </select>
</form>
<script LANGUAGE="javascript">

</script>
</body>
</html>
这样用
<script>
function mchange(mName){
var olds = document.getElementById('tid');
for(i=0;i<2;i++){
olds.options[i] = new Option("测试一","1")
} }
</script>
<form name="PageForm" method="post" action="<%=thisPageName%>">
  <div align="center">
    <table width="90%" border="0" cellpadding="2" cellspacing="0">
      <tr>
        <td width="20%" height="22">模块分类 </td>
        <td width="21%">
          <select id="mid" name="model" onchange="mchange('aa')">
            <option value="q">a</option>
            <option value="b">bb</option>
            <option value="c">cc</option>
          </select>
        </td>
        <td width="16%">主题</td>
        <td width="19%">
          <select id="tid" name="topic">
          </select>
        </td>
        <td width="24%"> </td>
      </tr>
    </table>
  </div>
  </form>
呵呵，对于innerHTML属性虽然可以应用于Select标签，但是不能在使用innerHTML来实现插入TD、TR、OPTION等对象，要插入这些对象，要实现你的程序，可以使用以下代码：function mchange(mName){
  var oOption,oSelect;
  oSelect= document.all('tid');
  for(var i=0;i<10;i++){
    //每一个option对象都要进行新建
    oOption = document.createElement("OPTION");
    oOption.text="测试"+(i+1);
    oOption.value=i;
    oSelect.add(oOption);
  }
alert("添加完成，现在select的innerHTML为：\n"+document.all('tid').innerHTML);
}
还有一种方法就是：
当要insert的option比较多时，速度会很慢，我认为最好办法就是使用构造字符串，再用outerHTML来实现替换原来对象，但会造成对象的瞬间闪烁，可是相对赢得的时间来说，是值得的，看下面测试：<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head><body>
<select name="tid1">
</select>
<select name="tid2">
</select>
<script language="VBScript">

</script>
</body>
</html>