浏览器插件——清除百度推荐

阳光穿透心脏的1/2处 2022-06-10 09:09 206阅读 0赞

## 相关链接 ##

\*项目地址\*

github: [ https://github.com/programluo/cleanbaidu][https_github.com_programluo_cleanbaidu]。

\*插件下载地址\*

[http://download.csdn.net/download/luo4105/9953365][http_download.csdn.net_download_luo4105_9953365]。

后来发现使用AdAdblock Plus自定义过滤规则也能实现我想要的功能，现在贴出自定义规则。

http://pos.baidu.com/*
    https://pos.baidu.com/*
    http://googleads.g.doubleclick.net/*
    https://googleads.g.doubleclick.net/pagead/ads
    ###content_right
    ###qb-side
    ##.lemmaWgt-promotion-vbaike
    ##.lemmaWgt-promotion-slide
    ###under_post_kb

## 需求 ##

工作中使用百度时，总有一些推荐的信息使我工作分心，打断我工作。我便写一个浏览器插件，屏蔽百度推荐等功能。

就是屏蔽这些东西

![Center][]

![Center 1][]

![Center 2][]

## 实现 ##

### 实现代码 ###

创建一个文件夹cleanbaidu，这是插件的根目录。

cleanbaidu下创建manifest.json文件，这是插件的配置文件，浏览器导入该插件时，会读取该文件。

manifest.json.json

{
       "manifest_version": 2,
       "name": "清理百度",
       "description":"使用百度时，清除百度的热点搜索、V百科、知道日报这些打扰工作，让人分心的栏目",
       "version": "1.0",
       "browser_action":
        {
           "default_icon": "icon/icon32.png",
           "default_popup": "popup.html"
       },
       "icons":{
           "16": "icon/icon32.png",
           "48": "icon/icon32.png",
           "128": "icon/icon32.png"
       },
       "permissions": [
           "<all_urls>"
       ],
       "content_scripts": [
        {
           "matches": ["https://*.baidu.com/*"],
            "js":["js/jquery-3.2.1.min.js","js/cleanbaidu.js"]
       }]
    }

属性

manifest\_version：值必须为2

browser\_action：安装后浏览器上的动作，这里的两个属性分别是浏览器上的插件图片和点击插件弹出的页面窗口(常用于设置)

content\_scripts：导入脚本配置

matches：在那些页面导入配置

js：导入哪些js

更多详细的配置请看：[http://open.chrome.360.cn/extension\_dev/manifest.html\#incognito][http_open.chrome.360.cn_extension_dev_manifest.html_incognito]。

cleanbaidu.js

/** 屏蔽百度的热点搜索 */
    var baidu =document.getElementById("content_right");
    if(baidu != undefined){
             baidu.style.display= "none";
    }
    $("#su").on("click",function(){
             setTimeout("$(\"#content_right\").hide();",500);
    });
    /** 屏蔽百度百科的V百科等 */
    var vbaike = $(".side-content.lemmaWgt-promotion-vbaike");
    if(vbaike.length == 1) {
             vbaike.hide();
    }
    var xg = $(".side-content.lemmaWgt-sideRecommend");
    if(xg.length == 1) {
             xg.hide();
    }
    var movieSide = $(".side-content.lemmaWgt-promotion-slide");
    if(movieSide.length == 1){
             movieSide.hide();
    }
    /** 屏蔽知道日报 */
    var zhidao =document.getElementById("qb-side");
    if(zhidao != undefined){
             zhidao.style.display= "none";
    }

这就是js代码，有点js基础都能看懂。

popup.html

<!doctype html>
    <html>
     <head>
       <title></title>
       <style>
         body { 
           width: 50px; 
        }
       </style>
     </head>
     <body>
       clean baidu
     </body>
    </html>

### 项目结构 ###

![Center 3][]

## 如何使用 ##

在谷歌浏览器中输入chrome://extensions/并跳转。选中开发者模式，点击“加载已解压的扩展程序…”，选择cleanbaidu目录。

![Center 4][]

如果从浏览器的搜索框直接搜索进入百度，无法屏蔽baidu热点，需要把页面刷新一下

![Center 5][]

[https_github.com_programluo_cleanbaidu]: https://github.com/programluo/cleanbaidu
[http_download.csdn.net_download_luo4105_9953365]: http://download.csdn.net/download/luo4105/9953365
[Center]: /images/20220610/fae6c2a62fa84bbca277b75225558f0d.png
[Center 1]: /images/20220610/340840a105a04e1687a77a844b1bb1cd.png
[Center 2]: /images/20220610/54800c1853ad4de8af72787c5547775d.png
[http_open.chrome.360.cn_extension_dev_manifest.html_incognito]: http://open.chrome.360.cn/extension_dev/manifest.html#incognito
[Center 3]: /images/20220610/0b79a2adab3b4bb8b9b8d0ccec8325cc.png
[Center 4]: /images/20220610/073cacebda2a4619a21f766666d4e659.png
[Center 5]: /images/20220610/24ee0ffc8a094a6d956063fd4779d29a.png