Я пытаюсь создать расширение для хобби Chrome.Итак, что я пытаюсь сделать, это дать несколько кнопок управления для видео на YouTube.Мой Manifest.json -
{
"name": "Getting Started Example",
"version": "1.0",
"description": "Build an Extension!",
"permissions": ["activeTab", "declarativeContent", "storage", "webNavigation"],
"background": {
"scripts": ["background.js", "insertPlayerButtons.js"],
"persistent": false
},
"content_scripts": [{
"js": ["insertPlayerButtons.js"],
"matches": ["https://www.youtube.com/"],
"css" : ["insertPlayerButton.css"]
}],
"manifest_version": 2
}
Мой ContentScript -
var currentspeed = 1;
document.onreadystatechange = function () {
if (document.readyState === 'complete') {
addElement();
}
}
function addElement () {
var container = document.getElementById('player-container');
var testButton = document.createElement("button");
testButton.type = "button";
testButton.onclick = test;
var forwardText = document.createTextNode("test");
forwardButton.appendChild(forwardText);
container.appendChild(forwardButton);
};
function test() {
//dosomething
};
Мой background.js -
chrome.webNavigation.onHistoryStateUpdated.addListener(function() {
addElement();
});
Так что происходит, когда мы загружаем youtubeдомашняя страница, то есть youtube.com
, тогда нет player-container
div, поэтому элемент не будет добавлен в dom.
После этого, когда я нажимаю на какое-то видео и перехожу на страницу с видео https://www.youtube.com/watch?****
, сценарии запускаются снова, но я не могу получить доступ к DOM.Даже если событие onHistoryStateUpdated вызывается background.js.Но я не могу добавить Childs в Dom, потому что container
возвращается как ноль.
Если я просто перезагрузлю https://www.youtube.com/watch?****
эту страницу, тогда все будет нормально.
Только когда я перехожу с youtube.com
на https://www.youtube.com/watch?****
, он перестает работать.
Это первое расширение, которое я пытаюсь построить, поэтому, если мне не хватает чего-то простого .... пожалуйста, извините