Question

我有一个contentcript，它本质上是一个console.log来表示它已被注入页面，而我的manifest.json将all_frames设置为true。

因此，如果我转到http://www.reddit.com/r/videos，我会在每个帧中看到一条消息，如果我点击一个视频，我还会看到一条消息来自注入视频的iframe的脚本。这向我表明，如果页面被动态修改为包含iframe，则会将contentcript注入其中。

当我转到http://www.html5video.org时，我只收到来自一帧的消息，但是如果我查看DOM，我会看到视频中有一个iframe，所以我希望我的内容被注入其中，但事实并非如此。

我的最终目标是在页面上为视频选择一个选择器，我希望能够通过在iframe中注入代码来实现这一目的。

非常感谢帮助。

Answer 1

我怀疑Chrome会将您的内容脚本注入IFRAME，这是原始页面源的一部分，就像reddit.com示例一样 - IFRAME是原始页面的一部分，因此Chrome可以并将注入其中。对于html5video链接，IFRAME不是原始源的一部分。但是，如果您检查元素，您可以看到IFRAME，它告诉我IFRAME已动态加载到DOM。我看到了与我编写的扩展程序相同的行为，因此它似乎是一致的。

如果您需要注入IFRAME，那么您可以挂钩DOM创建事件并采取您需要的操作：

document.addEventListener('DOMNodeInserted', onNodeInserted, false);

更新：

http://html5video.org/的这个怎么样 - 使用下面的content_script代码，我可以得到IFRAME，然后是VIDEO标签。注意：对于Reddit，这种方法/概念也应该也能很好地发挥作用。

content_script.js

console.log("content script for: " + document.title);

var timer;

document.addEventListener('DOMNodeInserted', onNodeInserted, false);

function onNodeInserted(e)
{
    if(timer) clearTimeout(timer);
    timer = setTimeout("doSomething()", 250);
}

function doSomething()
{
    $media = $(".mwEmbedKalturaIframe");
    console.log($media);
    $video = $media.contents().find("video");
    console.log($video);
}

的manifest.json

{
  // Required
  "name": "Foo Extension",
  "version": "0.0.1",

  // Recommended
  "description": "A plain text description",
  "icons": { "48": "foo.png" },
  //"default_locale": "en",

  // Pick one (or none)
  "browser_action": {
    "default_icon": "Foo.png", // optional
    "default_title": "Foo Extension"      // optional; shown in tooltip
    },

  "permissions": [ "http://*/", "https://*/", "tabs" ],

  "content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"],
      "js": ["jquery-1.7.1.min.js", "content_script.js" ],
      "run_at": "document_idle",
      "all_frames": true
    }
    ]
}

另请参阅：jQuery/JavaScript: accessing contents of an iframe

Chrome扩展程序未将Javascript注入iframe

1 个答案: