Как добавить кнопку на веб-страницу с помощью расширения Chrome

Я использую content scripts, и я хотел бы ввести кнопку на веб-страницу.Как добавить кнопку на веб-страницу с помощью расширения Chrome

Это мой manifest.json:

{ 
    "manifest_version": 2, 
    "name": "my extension", 
    "browser_action": { 
    "default_icon": "icon.png", 
    "default_popup": "popup.html" 
    }, 
    "permissions": [ 
    "activeTab" 
    ], 
    "content_scripts": [ 
     { 
     "matches": ["http://127.0.0.1:8000/*"], 
     "js": ["script.js"], 
     "run_at": "document_end" 
     } 
    ] 
}

Это popup.html:

<html> 
    <body> 
    <input type="button" id="button" style="display:none;"> 
    </body> 
</html>

И script.js:

document.body.style.backgroundColor = "yellow"; 
var button = document.getElementById("button"); 
button.style.visibility = "visible";

Когда собирается http://127.0.0.1:8000 я вижу фоновые изменения в желтый цвет, однако он не находит кнопку потому что это не часть веб-страницы, обслуживаемой моим локальным сервером. Он показывает эту ошибку:

Uncaught TypeError: Cannot read property 'style' of null

Что я должен сделать, чтобы впрыснуть кнопку на верхней части содержания в http://127.0.0.1:8000 (предполагая, что я не знаю его содержание)?

источник

2016-03-21 Forge

Чтобы вставить кнопку, просто создать в вас скриптах контента и вставить его, вам не нужно (не нужно) объявить его в popup.html

manifest.json

{ 
    "manifest_version": 2, 
    "name": "my extension", 
    "content_scripts": [ 
     { 
     "matches": ["http://127.0.0.1:5000/*"], 
     "js": ["script.js"]   
     } 
    ] 
}

script.js

document.body.style.backgroundColor = "yellow"; 
var button = document.createElement("button"); 
document.body.appendChild(button);

источник

2016-03-22 02:28:26

Вы должны добавить "run_at": "document_end" в вашем content_scripts собственности

В document_end, файлы сценариев будет вводиться после того, как DOM будет завершена. Таким образом document сможет найти утерянную кнопку :)

"content_scripts": [ 
     { 
     "matches": ["http://127.0.0.1:5000/*"], 
     "js": ["script.js"], 
     "run_at": "document_end" 
     } 
    ]

источник

2016-03-21 16:49:42 PierreDuc

Как добавить кнопку на веб-страницу с помощью расширения Chrome

ответ

Смежные вопросы