2

我想通过 chrome 扩展来编辑 iframe 的内容，但因为 iframe 的 contentWindow/contentDocument 返回未定义而无法编辑。一直在寻找答案，据我所知，如果 iframe 从一开始就存在于页面上，它很容易修复，但事实并非如此。有问题的 iframe 是 iframe 形式的 gmail 撰写文本区域，它是动态添加到 DOM 中的。有没有办法通过 chrome 扩展来做到这一点？

编辑：对不起。Rob W 让我意识到 contentDocument 确实可以访问。我在这里要做的是在 Gmail 中添加一些额外的功能，在工具栏中有一个按钮，可以在撰写窗口中添加一些 html。我现在让按钮部分工作，它添加了 html，但它并没有像它应该的那样在插入符号处执行它，因为我无法访问 contentWindow 来执行此操作：

range = iWindow.getSelection().getRangeAt(0);
node = range.createContextualFragment(html);
range.insertNode(node);

有什么解决办法吗？

4

1 回答 1

3

contentWindow在 Chrome 扩展程序中无法访问。
contentDocument另一方面，如果 iframe 位于同一来源（Gmail 就是这种情况），则可以正确返回框架内的文档。

这是 Gmail 的示例。为简单起见，我假设文档中只有一个编辑器。

var poller = setInterval(function() {
    var editor = document.querySelector('iframe.editable');
    if (editor && editor.contentDocument && !editor.__rwHandled) {
        editor.__rwHandled = true; // Run once for an editor instance
        var textNode = document.createTextNode('It works!');
        editor.contentDocument.body.appendChild(textNode);
    }
}, 200);

每当您想停止轮询器时，只需使用clearInterval(poller);. 确保您的检测方法价格低廉。例如：查询 DOM 节点是可以的，打开新窗口不是。

于 2012-12-02T13:43:32.437 回答