如何使用Prototype处理iframe contentDocument

Question

问题是,默认情况下,Prototype库无法访问iframe中的任何内容.

我找到了一些解决方法(例如示例)但没有人提供对protytpe/iframe的完全支持.有谁知道这样做的方法？

PS:不使用iframe不是一个选项:)

Answer 1

如果要在不同文档中使用Prototype(并且iframe是不同的文档),则必须在每个文档中包含脚本,并使用正确的副本访问关联文档.

jQuery和任何其他直接引用的框架也是如此document.库的每个实例都与其自己的document对象相关联.因此,当您从父脚本创建元素时,它ownerDocument是父窗口.尝试将该元素附加到iframe的文档中,您应该获得DOMException.WRONG_DOCUMENT_ERR.

var iframe= $('myiframe');
// get window and document objects for iframe (IE compatible)
var idoc= iframe.contentDocument || iframe.contentWindow.document;
var iwin= iframe.contentWindow || iframe.contentDocument.defaultView;

Element.extend(idoc);
idoc.body.insert('<div>hello</div>'); // fail, wrong document

iwin.Element.extend(idoc); // use the copy of Prototype in the iframe's window
idoc.body.insert('<div>hello</div>'); // ok

(请注意,在Firefox中你实际上不会得到一个WRONG_DOCUMENT_ERR,因为他们会默默地为你修复这个错误.但更复杂的操作会很快让你处于奇怪的,不一致的状态.)

大多数JS库旨在简化单文档脚本; 他们隐藏了DOM操作中涉及的大部分血腥细节,他们这样做的方法之一是消除document对象.但这使得它们不太适合跨文档脚本,在这里,知道document使用哪个是至关重要的.

跨文档脚本已经令人困惑.使用一个不是专门设计用来处理它的JS框架(我不知道那个)只会让生活变得更加怪异.