JavaScript学习笔记（7） IE环境下cloneNode的一个bug

     cloneNode是进行DOM操作经常使用的方法，有了它我们可以很容易的克隆一个跟原来一模一样的DOM对象，如：在动态增加table的行的时候，我们只需克隆一个table中现有的行，然后调用talbe.appendChild()方法就可以实现，而无需调用table繁琐的DOM操作方法。但是在开发中，我发现cloneNode在对select进行克隆时却无法克隆出当前选中的option，克隆出来的对象的options中拥有selected属性的永远都是第一个。
 

 1 <! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
 2 < html >
 3    < head >
 4      < title > CloneNode.html </ title >
 5      < script  type ="text/javascript" >
 6        function $(id){
 7            return document.getElementById(id);
 8        }
 9        
10        window.onload = function(){
11            document.body.appendChild($("txt").cloneNode(true));
12            document.body.appendChild(document.createElement("<p>"));
13            document.body.appendChild($("select").cloneNode(true));
14        }
15     </ script >     
16    </ head >
17    < body >
18      < form >
19          < input  type ="text"  name ="txt"  id ="txt"  value ="测试一下CloneNode之后还有没有值"  style ="width:300px" />  
20          < select  id ="select"  name ="select" >
21              < option  value ="" > 请选择 </ option >
22              < option  value ="1"  selected > 1 </ option >
23              < option  value ="2" > 2 </ option >
24              < option  value ="3" > 3 </ option >
25          </ select >
26      </ form >
27    </ body >
28 </ html >
29

 
    下面是调用document.write($("select").cloneNode(true).outerHTML)后打印的HTML：

1 < SELECT  id =select  name =select >
2           < OPTION  value =""  selected > 请选择 </ OPTION >
3           < OPTION  value =1 > 1 </ OPTION >
4           < OPTION  value =2 > 2 </ OPTION >
5           < OPTION  value =3 > 3 </ OPTION >
6      </ SELECT >

    以上代码在FireFox下运行正常，但在IE中不正常!