[英]Remove some element from current DOM in chrome extension using Content Script
If there are many <div>
s in some web page like this:如果某个网页中有很多
<div>
是这样的:
<div tbinfo="ouid=1234567890&rouid=987654321"></div>
<div tbinfo="ouid=1234567891&rouid=987654321"></div>
<div tbinfo="ouid=1234567892&rouid=987654321"></div>
...
I have this content scripts, trying to remove some division(s) from them, if either ouid
or rouid
matches some key:我有这个内容脚本,如果
ouid
或rouid
匹配某个键,则尝试从中删除一些分区:
var i;
for (i = 0; i < arrID.length; i++) {
chrome.tabs.query(
{active: true}, function(tabs) {
var tab = tabs[0];
let code = `document.querySelectorAll('div[tbinfo]')`;
chrome.tabs.executeScript(tab.id, {code}, function (result) {
const key = arrID[i];
result.forEach(div => {
const tbinfoArr = div.getAttribute('tbinfo');
if (tbinfoArr.includes(key)) {
div.remove();
}
});
});
}
);
}
But chrome says Error handling response: TypeError: div.getAttribute is not a function
但是 chrome 说
Error handling response: TypeError: div.getAttribute is not a function
What's wrong here?这里有什么问题?
Suggested by @wOxxOm, I modified my code as below:由@wOxxOm 建议,我修改了我的代码如下:
for (i = 0; i < arrID.length; i++) {
alert(arrID[0] + ' ' + (typeof arrID[0])); // Alert No.1 // result: 123456789 string
chrome.tabs.query(
{active: true}, function(tabs) {
var tab = tabs[0];
const params = { ID: arrID[i] };
alert(arrID[i] + ' ' + JSON.stringify(params)); // Alert No.2 // result = undefined {}
alert(`(${ removeContent })(${ JSON.stringify(params) })`); // Alert No.4
chrome.tabs.executeScript({
code: `(${ removeContent })(${ JSON.stringify(params) })`
}, ([result] = []) => {
//
});
}
);
}
function removeContent(ID) {
var allElement = document.querySelectorAll('div[tbinfo]');
alert(JSON.stringify(ID)); // Alert No.3
var key = ID.ID;
allElement.forEach(div => {
const tbinfoArr = div.getAttribute('tbinfo');
if (tbinfoArr.includes(key)) {
div.remove();
}
});
return {
success: true,
};
}
alert(JSON.stringify(ID));
shows that ID
parameter is empty (result: {}
).显示
ID
参数为空(结果: {}
)。
So I tested ID's value and discovered that // Alert No.1
worked well, but // Alert No.2
was empty.所以我测试了 ID 的值并发现
// Alert No.1
运行良好,但// Alert No.2
为空。
So it seems like variable outside of chrome.tabs.query(
cannot be referenced inside??所以它看起来像是
chrome.tabs.query(
不能在内部引用??
The value of (${ removeContent })(${ JSON.stringify(params) })
is (${ removeContent })(${ JSON.stringify(params) })
是
(function removeContent(ID) {
var allElement = document.querySelectorAll('div[tbinfo]');
var key = ID.ID;
allElement.forEach(div => {
const tbinfoArr = div.getAttribute('tbinfo');
if (tbinfoArr.includes(key)) {
div.remove();
}
});
return {
success: true,
};
}) ({})
This value comes from // Alert No.4
.该值来自
// Alert No.4
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.