getElementById 在用于 <embed> 的 Google Chrome 扩展程序中不起作用 [英] getElementById not working in Google Chrome extension for <embed>

问题描述

在我的 Google Chrome 扩展内容脚本中，我有以下内容:

In my Google Chrome extension content script I have the following:

jQuery(document).ready(function() {
    var player = document.getElementById('player');
    console.log(player);
    console.log(document);
});

我在任何 Hulu 视频上运行它，其中嵌入了 id='player'

I'm running it on any Hulu video, which has the following embed with id='player'

<embed id="player" type="application/x-shockwave-flash" src="/site-player/playerwrapper.swf?cb=e80c477cL" width="100%" height="428" style="z-index:10;" name="player" quality="high" allowscriptaccess="always" allowfullscreen="true" bgcolor="#000000" flashvars="bitrate=700000&amp;user_id=-1&amp;startLoadWrapperTime=1299572732904&amp;overrideBrand=&amp;referrer=http://www.hulu.com/watch/20338/saturday-night-live-steve-carell-monologue#continuous_play=on&amp;continuous_play_on=true&amp;sortBy=&amp;initMode=4&amp;modes=4&amp;content_id=7751491&amp;cb=2011-3-8-8&amp;v=3">

例如以下链接http://www.hulu.com/watch/20337/saturday-night-live-snl-digital-short-the-japanese-office

但是当脚本运行时，console.log(player) 返回null.但是，console.log(document) 返回正确的文档对象.即使我尝试 var player = Document.prototype.getElementById.apply(document, ['player']);我仍然为空.

But when the script is run, console.log(player) returns null. However, console.log(document) returns the proper document object. Even if I try var player = Document.prototype.getElementById.apply(document, ['player']); I still get null.

有趣的是，如果我从 Chrome JavaScript 控制台尝试它，它工作正常，我将正确的 <embed> 打印到控制台.

The funny thing is, if I try it from the Chrome JavaScript Console, it works fine, I get the proper <embed> printed to console.

知道为什么这在我的内容脚本中不起作用吗?

Any ideas why this isn't working in my content script?

更新:根据要求，以下是我的 chrome 扩展文件夹的完整内容:

UPDATE: As requested, here are the complete contents of my chrome extension folder:

manifest.json:

manifest.json:

{
    "name": "gebidtest",
    "version": "1",
    "permissions": [
      "http://*/*",
      "https://*/*"
    ],
    "content_scripts": [{
      "matches": ["http://*/*"],
      "js": ["jquery-1.5.1.min.js","app.js"]
    }]
}

app.js:

jQuery(document).ready( function() {
    var player = document.getElementById('player');
    console.log(player);
    console.log(document);
});

jquery-1.5.1.min.js:我刚下载

jquery-1.5.1.min.js: I just downloaded it

我在 Mac 上使用 Chrome 版本 10.0.648.127，但我也在 PC 上尝试过，结果相同

I'm using Chrome version 10.0.648.127 on a Mac, but I also tried it on a PC with the same results

推荐答案

原来是时间问题.即使它在 jQuery(document).ready() 中，getElementById 也失败了，因为还没有加载嵌入.当我执行几秒钟的 setTimeout 时，getElementById 起作用了.

Turns out the problem was with timing. Even though it was inside a jQuery(document).ready(), the getElementById failed because the embed wasn't loaded yet. When I do a setTimeout of a few seconds, the getElementById works.

这篇关于getElementById 在用于 <embed> 的 Google Chrome 扩展程序中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！