javascript - DOM异常: HIERARCHY_REQUEST_ERR (3) while appendTo function

Question

我正在尝试在窗口主体中创建一个弹出窗口，如下所示:

this.jNotifObj = $('<div class="notify-osd DialogInner"><div class="imgClose" onclick="$(this).parent().hide();"></div><div style="Float:left;max-width:50%;overflow:hidden;"><h2>' + this.opts.message + '&nbsp;</h2></div><div id=divAction1  style="Float:left;max-width:20%;padding-left:10px;overflow:hidden;"><h3>' + this.opts.actionTitle1 + '</h3></div><div id=divAction2  style="Float:left;max-width:20%;padding-left:10px;overflow:hidden;"><h3>' + this.opts.actionTitle2 + '</h3></div></div>').hide();

 $(this.jNotifObj).appendTo(this.parentWindow .document.body).fadeIn('fast', function () {
// codes here
// test code
});

我收到如下错误:

DOM 异常:HIERARCHY_REQUEST_ERR (3)

我已经引用了之前关于此错误的问题。但又失败了...请帮助我解决这个问题。预先感谢您。

Answer 1

这是一个复杂的主题，我已经对此进行了一些研究。由于同一问题，IE 中存在多个错误，您遇到的错误就是其中之一。

尽管现代浏览器在实现细节上有所不同，但它们都同意在当前版本中对窗口之间的访问进行安全限制。 Chrome 是目前唯一允许按照您的方式访问父窗口的浏览器(当且仅当两个窗口都指向同一域上的位置时)。

我没有在互联网上找到列出什么是可能的、什么是不可能的来源，但从我所做的来看，我认为你可以做的是:

1. 通过引用将对象传递到其他窗口
2. 按值将简单值(字符串、整数等)传递到其他窗口

你不能做什么:

1. 访问和操作其他窗口上的 DOM(我认为这是您问题的一部分)
2. 对通过引用传递的对象调用函数(也可能是您的问题的一部分)

对我来说解决方案(可能是将来唯一可用的解决方案)是 postMessage()。

请参阅示例:http://javascript.info/tutorial/cross-window-messaging-with-postmessage

该系统允许您以安全的方式在浏览器窗口之间进行通信。我用它尝试了很多东西，最重要的是你可以传输任何可以转换为 JSON 的东西。另一方面，这意味着如果您无法将其转换为 JSON，则无法发送它。

另请注意，您始终必须提供目标域。如果您不关心使用哪个 targetDomain，则必须提供“*”。如果您不提供任何内容，则不会发送消息。

因此，对于您的情况，这意味着您必须向将监听该消息的父窗口发送一条消息。当它收到该消息时，它将自行执行您想要实现的任何操作。