mar*_*ark 0 javascript embed flash getelementbyid google-chrome-extension
在我的Google Chrome扩展程序内容脚本中,我有以下内容:
jQuery(document).ready(function() {
var player = document.getElementById('player');
console.log(player);
console.log(document);
});
我正在任何Hulu视频上运行它,其中嵌入了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&user_id=-1&startLoadWrapperTime=1299572732904&overrideBrand=&referrer=http://www.hulu.com/watch/20338/saturday-night-live-steve-carell-monologue#continuous_play=on&continuous_play_on=true&sortBy=&initMode=4&modes=4&content_id=7751491&cb=2011-3-8-8&v=3">
例如,以下链接http://www.hulu.com/watch/20337/saturday-night-live-snl-digital-short-the-japanese-office
但是当脚本运行时,console.log(播放器)返回null.但是,console.log(document)返回正确的文档对象.即使我尝试var player = Document.prototype.getElementById.apply(document, ['player']);
我仍然得到null.
有趣的是,如果我从Chrome JavaScript控制台尝试它,它工作正常,我得到适当的<embed>打印到控制台.
任何想法为什么这不适用于我的内容脚本？
更新:根据要求,以下是我的chrome扩展文件夹的完整内容:
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:我刚刚下载了它
我在Chrome version 10.0.648.127Mac上使用,但我也在具有相同结果的PC上尝试过
在JS中直接执行与DOM相关的操作是不正确的.例如:
default.html中
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="default.js"></script>
</head>
<body>
<a id="Bar" href="#"></a>
</body>
</html>
default.js
const bar = document.getElementById("Bar");
alert(bar.id);
此时DOM内容可能尚未完全加载,这就是"bar"可能为"NULL"的原因.
正确的方法是:
default.js
document.addEventListener('DOMContentLoaded', function() {
const bar = document.getElementById("Bar");
alert(bar.id);
});
即:在DOMContentLoaded事件发生时执行与DOM相关的操作.
"setTimeout"不是正确的方法,因为您无法通过设置一些时间延迟来确保DOM内容已完全加载!