addEventListener trong tập lệnh nội dung không hoạt động

Question

Tôi có tiện ích mở rộng chrome với popup.html và tập lệnh nội dung được chèn. Với tập lệnh nội dung được chèn vào, tôi đang cố truy cập các chức năng API javascript của youtube và tất cả đều hoạt động tốt ngoại trừ một: addEventListener.

Trình xử lý sự kiện API javascript của Youtube lắng nghe trạng thái video thay đổi. Vì vậy, nếu phần cuối của video được chuyển đến trạng thái thay đổi thành 0.

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

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

Đoạn mã này hoạt động tốt trong môi trường bình thường nhưng không hoạt động trong tập lệnh nội dung. Tại sao tôi không thể bắt các sự kiện thay đổi trong tập lệnh nội dung của mình? Bất kỳ ý tưởng?

Answer 1

Tập lệnh nội dung làm không phải chạy trong phạm vi trang hiện tại. Xử lý sự kiện phải được tiêm qua một thẻ <script>, như mô tả trong câu trả lời này: 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 có sẵn cho tập lệnh nội dung, vì vậy việc ràng buộc trình xử lý sự kiện sẽ hoạt động.