Chrome 百度搜索熱點過濾插件 - 開源軟體

来源:https://www.cnblogs.com/xuyaowen/archive/2018/12/21/HotSearchkiller.html
-Advertisement-
Play Games

學習時,為了搜集最全的中文資料,有時候不得不使用Baidu搜索引擎。在你還是個小菜雞的時候你可能會花費大量時間在百度上! 但是,時間久了你會發現,你總會被網路上一些奇奇怪怪或者有趣的事情吸引過去而逐漸忘記自己曾經打開百度是要乾什麼?時間就這樣被一些無關緊要的有趣的事情給浪費了。 對於廣告吧,還能使用 ...


學習時,為了搜集最全的中文資料,有時候不得不使用Baidu搜索引擎。在你還是個小菜雞的時候你可能會花費大量時間在百度上!

但是,時間久了你會發現,你總會被網路上一些奇奇怪怪或者有趣的事情吸引過去而逐漸忘記自己曾經打開百度是要乾什麼?時間就這樣被一些無關緊要的有趣的事情給浪費了。

對於廣告吧,還能使用廣告清除插件來進行清除。但是一些非廣告信息實在是廣告清除插件不能判斷了!無用的事情浪費了我大量時間!!!這讓我十分生氣!!尤其是百度的搜索熱點,我真不想再看到它:

這些所謂的熱搜,很多時候是帶有娛樂性質的!往往會浪費我們太多太多時間!我們重要的事情是乾什麼?是學習!! 在強烈憤怒之下,為了讓我專心“科研”!不得不親自動手,寫一個瀏覽器插件了!!!

開工

瀏覽器版本:chrome 版本 71.0.3578.80(正式版本) (64 位)

程式是在這個chrome版本下進行構建的,其他平臺我沒有測試,如果有熱心的網友對其他版本進行測試,可以在評論區註明您的版本,非常感謝您!

當動手的時候才發現,我還不會寫插件.....只能邊學習邊做了;網路上有很多很好的教程,大家可以跟著學習一下,前提是要對前端技術有一定的瞭解。

參考教程如下:http://blog.haoji.me/chrome-plugin-develop.html#da-bao-yu-fa-bu 這篇博客內容很豐富,非常好!

學會寫插件後,其實困難就不大了。

熱點搜索去除的思路比較簡單,下麵對程式核心思想進行簡單進行說明。下麵就是插件的運行的狀態,已經成功安裝到chrome之中!

 

主要思想:使用Javascript 進行操作DOM,選中對應的dom子樹,設置為不可顯示,即可解決。超級簡單

當你寫插件的時候,還應該明白:chrome插件的js 和 網頁本身的js 分別運行在兩個不同的環境之中。但是他們公用同一個DOM。可以使用代碼註入的方式,使得這兩個js環境可以互相調用了。其他部分都很簡單了,我就直接上代碼了!如果你有不明白的地方可以到我的github主頁,下載源代碼進行分析:https://github.com/yaowenxu 我很菜,不要嘲笑我:),雖然菜,但我想要star :D

圖中killer.js 就是核心代碼了!代碼內容如下:

/*
    作者:yaowenxu
    時間:2018年12月21日16:59:41
    主頁:https://github.com/yaowenxu
    功能:插件註入JavaScript 腳本
*/
// 日誌模塊
// 註意,必須設置了run_at=document_start 此段代碼才會生效
stat = false; // 判斷是否重新進行載入
document.addEventListener('DOMContentLoaded', function()
{
    // 註入自定義JS
    injectCustomJs();
    console.log("歡迎您使用——百度搜索熱點過濾器");
    console.log("如果您感覺效果不錯,請您前往:https://github.com/yaowenxu 給個star 吧");
    var date = new Date();
    var year = date.getFullYear();
    var month = date.getMonth()+1;
    var day = date.getDate();
    var time = date.toLocaleTimeString()
    console.log("當前時間:"+ year +"-" + month +"-" + day +" " +time);

    // 讀取本地存儲
    var status = null;
    chrome.storage.sync.get(["choice"], function(items) {
        console.log("當前配置狀態:"+items.choice);
        status = items.choice;
        stat = false;
        if (status != "no"){
            removeAD();
            stat = true;
        }
    });

    $("#con-ar").bind('DOMSubtreeModified', function(e) {
        // 無內容
    });
});

// 當節點dom 中內容發生變化的時候,重新進行刪除!!!不然百度熱搜還是會出現!
document.addEventListener('DOMSubtreeModified', function()
{
    if(stat){
        var dom = $(".FYB_RD");
        dom.hide();  // 繼續進行刪除
    }

});

// 主模塊,執行DOM 過濾操作
function removeAD(){
    var dom = $(".FYB_RD");
    console.log("獲取到排行榜內容:");
    console.log(dom);
    dom.hide();
    //dom.remove();
}

// 向頁面註入JS
function injectCustomJs(jsPath)
{
    jsPath = jsPath || 'js/inject.js';
    var temp = document.createElement('script');
    temp.setAttribute('type', 'text/javascript');
    // 獲得的地址類似:chrome-extension://ihcokhadfjfchaeagdoclpnjdiokfakg/js/inject.js
    temp.src = chrome.extension.getURL(jsPath);
    temp.onload = function()
    {
        // 放在頁面不好看,執行完後移除掉
        //this.parentNode.removeChild(this);
        console.log(chrome.extension.getURL(jsPath));
    };
    document.head.appendChild(temp);
}

有了這段核心代碼,相信能讀懂js的人都懂了吧。我就不多說了。簡單記錄一下就行了。

執行效果:你會發現應該出現搜索熱點的地方果然不見了!

在程式書寫的過程中,由於百度的非同步刷新的機制,我再document上載入dom的變化事件的監聽函數(如下代碼所示),完美得解決了問題。最後希望您使用愉快!

document.addEventListener('DOMSubtreeModified', function()
{
    if(stat){
        var dom = $(".FYB_RD");
        dom.hide();  // 繼續進行刪除
    }
});

安裝方式:

訪問:https://github.com/yaowenxu/Hot-Search-Killer 下載源碼;

 

如下所示:

 

解壓後:

然後使用chrome開發模式即可安裝了:

chrome 訪問:

打開開發者模式,選擇載入已解壓的擴展程式就行啦。選擇剛剛下載的github文件所在的位置,即可以添加。添加上就能載入使用插件了~

 

 

你會發現出現了:

在右上角。

 

最後,程式完美運行,祝您使用愉快!!!

去玩耍了,有啥問題,還請您留言~謝謝大家的支持~~

 

補充:2018年12月22日16:32:18

有同學說,為啥不用油猴呀,油猴多好用呀;帶著好奇,我又在油猴插件上實現了一遍,歡迎star, 歡迎試用

使用Tampermonkey(油猴) 插件,重新實現了,百度搜索熱點過濾功能

 


 

 保持更新,轉載請註明出處。如果軟體或博客有幫到您,還請您給個小的star 。謝謝您了~ https://github.com/yaowenxu/Hot-Search-Killer


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 很多人都不知道查詢參數用來幹啥,下麵總結一下日常項目中常用的幾個查詢參數的地方。(本人不太歡hardcode的東西) ...
  • 問題: Gradle sync failed: Connection timed out: connect Consult IDE log for more details (Help | Show Log) (23 s 591 ms) 問題原因: Androidstudio的網路通信被網路防火牆阻 ...
  • https://www.zhihu.com/question/292819209 ...
  • UIApplication深入研究 很多時候,我們不需要關心這個類,我們很少繼承這個類,偶爾會調用這個類的api來實現一些功能,但是不可否認,這個類是iOS編程中很重要的一個概念,所以我這裡寫這個文章來總結以下這個類的信息,如果寫的不對的地方,請留言,多謝。 UIApplication的核心作用是提 ...
  • Editor.md是一款優秀的開源Markdown 編輯器,在使用中遇到的一些問題和功能改進分享給需要的伙伴。 ...
  • 一、組件渲染 當組件的props或者state發生改變時,組件會自動調用render方法重新渲染。當父組件被重新渲染時,子組件也會被遞歸渲染。那麼組件是如何渲染的呢? 二、組件的生命周期 組件的聲明周期可分成三個狀態:Mounting,已插入真實 DOM;Updating,正在被重新渲染;Unmou ...
  • <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0"/> ...
  • redux數據流向 基本使用 " " ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...