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>标记注入，如本答案中所述：Building a Chrome Extension with Youtube Events：

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可用于内容脚本，因此绑定事件处理程序确实有效。

内容脚本中的addEventListener不起作用

1 个答案: