Google chrome extension chrome扩展中的内容脚本
我必须通过chrome扩展在谷歌搜索页面中添加div 我的inject.js文件如下:Google chrome extension chrome扩展中的内容脚本,google-chrome-extension,content-script,Google Chrome Extension,Content Script,我必须通过chrome扩展在谷歌搜索页面中添加div 我的inject.js文件如下: var body=document.getElementById("search"); //creates bar and creates bar removal function var bar = document.createElement("DIV"); function removeBar(){ bar.remove(); } //styles bar var ds = bar.style;
var body=document.getElementById("search");
//creates bar and creates bar removal function
var bar = document.createElement("DIV");
function removeBar(){
bar.remove();
}
//styles bar
var ds = bar.style;
ds.position = "fixed";
ds.width = "512px";
ds.height = "33px";
ds.background = "rgba(0,0,0,0.86)";
ds.zIndex = "9999999999999";
//creates X button and makes it so clicking it runs the removeBar() function
var x = document.createElement("BUTTON");
x.onclick = removeBar;
bar.appendChild(x);
//styles button
var xs = x.style;
xs.background = "black";
xs.borderColor = "black";
xs.color = "rgba(255,255,255,.86)";
xs.position = "fixed";
xs.left = "100%";
xs.marginTop = "5px";
xs.marginLeft = "-29px"
//puts X in button
var xtext = document.createTextNode("X");
x.appendChild(xtext);
//puts bar in page
body.insertBefore(bar, body.children[0]);
{
"manifest_version": 2,
"name": "Inject script in webpage",
"version": "2.0.1",
"description": "inject script in webpage.",
"icons": {
"48" : "sample-48.png",
"128" : "sample-128.png"
},
"content_scripts": [
{
"matches": ["https://www.google.com.pk/*"],
"js" : ["inject.js"],
"all_frames": true
}
]
}
我的manifest.json如下所示:
var body=document.getElementById("search");
//creates bar and creates bar removal function
var bar = document.createElement("DIV");
function removeBar(){
bar.remove();
}
//styles bar
var ds = bar.style;
ds.position = "fixed";
ds.width = "512px";
ds.height = "33px";
ds.background = "rgba(0,0,0,0.86)";
ds.zIndex = "9999999999999";
//creates X button and makes it so clicking it runs the removeBar() function
var x = document.createElement("BUTTON");
x.onclick = removeBar;
bar.appendChild(x);
//styles button
var xs = x.style;
xs.background = "black";
xs.borderColor = "black";
xs.color = "rgba(255,255,255,.86)";
xs.position = "fixed";
xs.left = "100%";
xs.marginTop = "5px";
xs.marginLeft = "-29px"
//puts X in button
var xtext = document.createTextNode("X");
x.appendChild(xtext);
//puts bar in page
body.insertBefore(bar, body.children[0]);
{
"manifest_version": 2,
"name": "Inject script in webpage",
"version": "2.0.1",
"description": "inject script in webpage.",
"icons": {
"48" : "sample-48.png",
"128" : "sample-128.png"
},
"content_scripts": [
{
"matches": ["https://www.google.com.pk/*"],
"js" : ["inject.js"],
"all_frames": true
}
]
}
但当我加载GoogleSERP页面时,错误消息显示有点像不能调用null的insertBefore属性,似乎变量体未定义。通过检查google页面的元素,我检查了带有ID搜索的DIV是否存在,如果我做错了,那么plzz让我知道我是chrome扩展开发的新手问题可能在这里:
var body=document.getElementById("search");
body变量为null-可能是因为您要查找的id不存在。尝试寻找我使用的其他id gbqfb。但与其在这里给你答案,你真正应该做的是学会使用Chrome的内置调试器来找出代码不工作的原因。看看这段youtube视频:
@齐格曼德尔?默认设置是在加载DOM后运行,OP不会改变这一点。对不起,你是对的。问题可能是使用了名为body的变量,请将其重命名为其他变量,因为下面的其他引用似乎引用了document.body