内容脚本中的addEventListener不起作用

Question

我有一个带有popup.html和注入内容脚本的chrome扩展.使用注入的内容脚本我试图访问youtube的javascript API函数,除了一个:addEventListener之外它一切正常.

Youtube的javascript API的事件监听器监听要更改的视频的状态.因此,如果到达视频结尾,则状态变为0.

var currentVideo = document.getElementById('movie_player');
currentVideo.addEventListener("onStateChange", "onytplayerStateChange");

function onytplayerStateChange() {
   console.log("The state of the player has changed");
}

这段代码在正常环境中工作正常,但它无法在内容脚本中工作.为什么我不能在内容脚本中捕获更改事件？有任何想法吗？

Answer 1

内容脚本不在当前页面的范围内运行.必须通过另一个<script>标记注入事件处理程序,如以下答案中所述:使用Youtube事件构建Chrome扩展:

var actualCode = 'function onytplayerStateChange() {'
               + '    console.log("The state of the player has changed");'
               + '}';

var script = document.createElement('script');
script.textContent = actualCode;
(document.head||document.documentElement).appendChild(script);
script.parentNode.removeChild(script);

PS.DOM可用于内容脚本,因此绑定事件处理程序确实有效.