从chrome扩展程序中读取iframe内容

Question

我正在尝试在iframe中加载iframe.html，并将该iframe附加到我的Chrome扩展程序的当前页面的DOM中。我已经这样做了，我能够处理点击事件，获取框架元素值（输入，选择框）。一切都很好，直到这里。现在的问题是，一旦我将iframe.html中的内容插入DOM，我就无法修改iframe.html中的内容（更具体地说，我在iframe.html中有一个输入框[附加到DOM]，其值为“XXXX”，现在我想在用户点击我的扩展程序的上下文菜单时将其更改为“YYYY”。

我尝试使用

获取输入框值

$('#iframe_id').contents().find('input#input_id').val('YYYY')
(or)
window.frames['iframe_id'].document.getElementId('input_id').value

在我的content.js但没有帮助。

console.log($('#iframe_id'))

在控制台中打印iframe对象，但无法获取iframe文档内容。这是获取/修改Chrome扩展程序插入的iframe内容的正确方法吗？或者我在这里丢失了一些来自chrome的内容。* API

有关如何解决此问题的任何指示都会更有帮助。

TIA， Jagadeesh

Answer 1

我认为您遇到了问题，因为iframe和顶级页面的域和协议不匹配。这是页面安全限制。如果这确实描述了您的问题，则可以使用iframe postMessage API解决限制。

Answer 2

正如Mike Grace所说，我已经插入了html而不是iframe并构建了css，以便它可以在任何网页中使用。从长远来看，这将是一种更好的方法。