JavaScript学习笔记(7) IE环境下cloneNode的一个bug

xiaoxiao2022-06-12  83

     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中不正常!

相关资源:敏捷开发V1.0.pptx
转载请注明原文地址: https://www.6miu.com/read-4933451.html

最新回复(0)