当前位置:首页 > 开发 > Web前端 > 前端 > 正文

IE6下appendChild参数无效

发表于: 2012-11-06   作者:dingherry   来源:转载   浏览次数:
摘要: 关键字:IE6, appendChild, 参数无效,DIV, iframe 问题背景: 在一个iframe结构WEB页面,给弹出的窗口添加一个div。 结果在IE6下总是报:参数无效。IE7+ OK 注:窗口是Ext.Window 参考解决方案: ===============================================================
关键字:IE6, appendChild, 参数无效,DIV, iframe

问题背景:
在一个iframe结构WEB页面,给弹出的窗口添加一个div。
结果在IE6下总是报:参数无效。IE7+ OK
注:窗口是Ext.Window


参考解决方案:
=======================================================================
http://bbs.csdn.net/topics/340214383

iframe里是另外一个document树。所以把一个文档里创建的节点移动到另外一个里是会出错的:
详见:http://blog.csdn.net/supNate/archive/2007/03/20/1535738.aspx

为什么框架(frame)页面之间无法使用appendChild()? 收藏
今天在写程序时遇到一个需求,是需要在一个页面中使用程序改变其中的一个框架页面的DOM结构,于是自然会用到appendChild这样的方法,例如:
var div=document.createElement('div');
window.frames['frameName1'].contentWindow.document.body.appendChild(div);

尽管看上去没有任何问题,实际上在Firefox下它也能正常工作,但在IE下却偏偏不能正确运行,着实很郁闷。第一想法就是是:唉,该死的IE bug还真多!
无奈的开始google:frame+appendChild,希望能找到一些hack方法,倒有很多人建议用innerHTML,这个我也想过,太不方便,很多事件都无法绑定。
继续搜寻……,终于找到一篇文章解决了这个问题,基本意思是这样的:
document表示一个页面DOM结构的根节点,而document.createElement()方法是在document本身的结构中创建一个节点,因此想把一个文档的节点移动到另外一个文档的节点当中去,是不可行的。
呵呵,原来如此啊!这样的解释的确很合乎道理的,上面代码是有点问题,应该用子框架的文档(document)来创建节点:
var doc=window.frames['frameName1'].contentWindow.document;
var div=doc.createElement('div');
doc.body.appendChild(div);

这样在FF和IE下都能正确运行了!

但之前FF下为什么也能运行呢?有两种解释:
1。FF有自己的容错性,就像IE就有很多讨厌的容错性。
2。因为iframe是当前页面的节点,而iframe中的文档自然也认为是父页面的子节点了,只不过具有父页面根结点的所有特征,于是既然框架页面和父页面是在一个根下面,那么节点的互相移动也合乎道理了,呵呵,即使有点勉强,倒也能说的通的!

于是在这个问题上FF和IE孰是孰非也就很难说清楚了,只是辛苦了我们这些写程序的,现在大家明白怎么回事儿也就行了。

=======================================================================

个人问题解决:
问题发生时,一直是:this.mask = document.createElement("div");
因为是弹出窗口,且已脱离了parent的document,所以这时应该在弹窗的document里创建这个节点,故改成:top.document.createElement("div");这样再.body.appendChild(this.mask);就对了。











IE6下appendChild参数无效

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
今天需要做个tab选项卡,如下图所示的效果: 做法很简单,就是给tab切换的按钮父级元素加上margin-b
http://hi.baidu.com/hongz1125/blog/item/7f99b31283c185c5c3fd78b5.html by zhangxinxu from http
#container{ height:500px; background:#fff; /*黑色*/ } #page{ min-height:500px; background:#F0
首先,我们有一个编辑器,有一个简单的HTML页面,页面的级别分别 --> html -->head[title,me
在 IE6 中实现 position:fixed; 的办法 刚刚提过,在IE6中是不能直接使用 position:fixed; 。你需要
在 IE6 中实现 position:fixed; 的办法 刚刚提过,在IE6中是不能直接使用 position:fixed; 。你需要
如题,他们之间有区别吗? 感觉上只有,他们添加的位置不同。 困惑1 document.body.appendChild(for
作者: xcntime 发表于 2010-08-11 10:49 原文链接 阅读: 0 评论: 0 [译]IE6终极备忘:修复IE6下 25+
造成IE6报Aborted的情况有很多,本文着重解析<a>标签中添加onclick事件时导致的Aborted情况。
近日,在工作中发现,IE6的div高度不能低于18px,设置了半天10px还是18px,总是差8px。而FF等其他浏
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号