我正在尝试创建一个基本的 Google Chrome 扩展程序,它只是复制我所在页面上的源 HTML 代码。我从未创建过 Chrome 扩展程序,我真的被困住了,希望得到一些帮助。我使用 Chrome 指南启动了扩展程序,从我在互联网上读到的内容是我访问网页的内容脚本。但是,我不知道如何调用内容脚本。我尝试使用 import 语句,但收到错误 - 我想我真的误解了整个事情是如何工作的。我还试图让控制台日志显示在网页控制台中,而不是 chrome 扩展控制台中。
弹出窗口.html
<!DOCTYPE html>
<html>
<head>
<style>
button {
height: 30px;
width: 30px;
outline: none;
}
</style>
</head>
<body>
<button id="changeColor"></button>
<script src="popup.js"></script>
</body>
</html>
清单文件
"name": "Company Websites",
"version": "1.0",
"description": "Build an Extension!",
"background": {
"scripts": ["background.js"],
"persistent": false
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": ["content.js"]
}
],
"page_action": {
"default_popup": "popup.html"
},
"permissions": ["storage","declarativeContent"],
"manifest_version": 2
}
内容.js
document.addEventListener('DOMContentLoaded', function() {
document.getElementById("changeColor").addEventListener("click", handler);
});
// The handler also must go in a .js file
function handler() {
console.log("hello?");
//somehow copy source code
}
背景.js
chrome.runtime.onInstalled.addListener(function() {
chrome.storage.sync.set({color: '#3aa757'}, function() {
console.log("The color is green.");
});
});
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
chrome.declarativeContent.onPageChanged.addRules([{
conditions: [new chrome.declarativeContent.PageStateMatcher({
pageUrl: {hostEquals: '* insert target web address*'},
})
],
actions: [new chrome.declarativeContent.ShowPageAction()]
}]);
});
任何帮助,将不胜感激!
创建另一个名为 load.js 的文件并执行XML HttpRequest,然后将其包含在 popup.html 中。
弹出窗口.html
<script src="load.js"></script>
加载.js
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var data = xhttp.responseText;
}}
xhttp.open("GET", "website url", true);
xhttp.send();
}
loadDoc()
从那里你可以在本地存储中存储和检索它,console.log(data),或者在 document.getElementById('ID').innerHTML = data 中使用它
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句