零全零美(www.zzgwt.com)
生活中的很多事情,并不像If...Else那么简单!
posts - 96,comments - 52,trackbacks - 0
     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中不正常!
posted on 2008-11-24 13:08 零全零美 阅读(1927) 评论(1)  编辑  收藏 所属分类: JavaScript

FeedBack:
# re: JavaScript学习笔记(7) IE环境下cloneNode的一个bug
2008-11-26 10:24 | 鬼火
在cloneNode select时还有其他问题。我cloneNode了一个select。然后给他赋了其他ID。但是在document.getElementById()的时候。分别搜2个select是搜不到的。只能搜到clone的那个。另外select.innerHTML= select2.innerHTML的时候似乎也有些问题。  回复  更多评论
  

只有注册用户登录后才能发表评论。


网站导航: