我正在尝试构建一个新的Chrome扩展程序,为Etsy列表页面添加一个按钮。 扩展程序已解压缩,一旦安装,它在任何站点上都可以正常运行。然而,无论我怎么做 - 我都无法看到Etsy的变化。
以下是运行的内容脚本:
document.body.appendChild( div );
div.appendChild( btnForm );
btnForm.appendChild( btn );
div.id = 'myDivId';
div.style.position = 'fixed';
div.style.top = '50%';
div.style.left = '50%';
div.style.width = '100%';
div.style.height = '100%';
div.style.backgroundColor = 'red';
同样,这在我测试的任何其他网页上都很有用。 我使用的权限:
"permissions" : [
"declarativeContent",
"contextMenus",
"tabs",
"http://*/*",
"https://*/*"
],
谢谢!
答案 0 :(得分:1)
你最明显的文件看起来像
{
"name": "SimplydevTranslator",
"homepage_url": "https://github.com/bsmahala/",
"version": "1.0",
"permissions": [
"*://*/*", "tabs", "webNavigation", "activeTab"
],
"content_scripts": [{
"matches": ["*://*/*"],
"js": ["contentscript.js"],
"run_at": "document_idle",
"all_frames": true
}],
"manifest_version": 2
}
您的代码必须以
编写// contentscript.js
function appendButton() {
var div= document.createElement('div');
var btnForm = document.createElement('div');
var btn = document.createElement('button');
document.body.appendChild( div );
div.appendChild( btnForm );
btnForm.appendChild( btn );
div.id = 'myDivId';
div.style.position = 'fixed';
div.style.top = '50%';
div.style.left = '50%';
div.style.width = '100%';
div.style.height = '100%';
div.style.backgroundColor = 'red';
}
appendButton();