前言
不知你是否存在着这样的困扰,当你在百度上搜寻某急切问题的答案时,发现全是广告,该相信还是不该相信,这是一个值得困惑的问题。当你看到某莆田系医院通过广告治死了某大学生时,心中蒙上了一层阴影,在你下一次通过百度搜索时,想起了当初被广告支配时的心理阴影。在你学习javascript语言后的某天,你收到来自过去的一封信,信中写了…
目标
制作一款插件将百度搜索结果中的广告过滤掉,包括左侧搜索结果和右侧推荐结果。
思路
分析广告出现的位置特征和出现的时机特征
位置:通过多次搜索,总结出如果某个span
或者a
标签的文本内容是”广告”,那么该标签祖先节点且该祖先节点位于#content_left>div
或#content_right>div
位置时,可以确定该祖先节点是广告节点。
时机:一般在页面加载后约1s左右。
方案
- 为
baidu
域名下的标签页写一个定时器,每隔1s执行一次去广告方法。 - 该方法会寻找并删除符合上面分析结果的节点。
代码
目录结构
manifest.json
{
"name": "百度去广告",
"version": "1.0",
"manifest_version": 3,
"description": "百度去广告",
"icons": {
"16": "images/icon-16.png",
"48": "images/icon-48.png",
"128": "images/icon-128.png"
},
"content_scripts": [
{
"js": [
"content_scripts.js"
],
"matches": [
"*://www.baidu.com/*"
],
"run_at": "document_end" //表示页面加载完后执行
}
]
}
content_scripts.js
function clearAD() {
let list = document.querySelectorAll("#content_left>div,#content_right>div");
for (let i = 0; i < list.length; i++) {
let item = list[i];
[].forEach.call(item.querySelectorAll("span,a"), function (span) {
if (span && span.innerHTML === "广告") {
item && item.remove(); //在调用remove方法前最好保证下item存在再执行,否则会报undefined没有remove属性
}
})
}
}
setInterval(clearAD, 1000);
console.log('content has injected')
结果
世界一片清净,万物本该如此。
谷歌应用市场已上传,搜索百度去广告
,找到下图所示图标安装。
转载请注明来源,欢迎对文章中的引用来源进行考证,欢迎指出任何有错误或不够清晰的表达,如有问题请邮件至2454612285@qq.com。