百度廣告高亮 Chrome插件(附源碼)

時間 2019-12-01

標籤百度廣告 chrome 插件源碼欄目 Chrome 简体版

原文原文鏈接

一前言

百度最近是上了輿論頭條了，相信中過百度毒的人對百度都反感。百度本身挖了這麼多坑，終究仍是要本身來填。國內網民使且最頻繁的搜過仍是以百度爲主，而百度依靠這種市場佔有率靠他的廣告競價排名大發橫財，卻把不少急需幫助的人推動了火坑。css

這一點在醫療方面是最突出的。html

其次基本的用戶體驗也是被丟棄，好比你們搜 "軟件培訓" 第一頁光廣告就佔去了一半以上...... 真心不能忍！並且標識爲廣告就靠着右下角一個小小的推廣字段，連軟件行業內的人都有可能不知道是廣告，更別說普通用戶了！工具

好！痛點出現了！能不能把百度的廣告高亮以提醒用戶謹慎點擊，因而這款插件就此誕生。網站

二分析百度廣告

百度的搜索廣告暫分爲兩種this

1 以「推廣」字段標識的單條結果如圖 url

2 以「推廣連接」字段標識的結果集spa

以上兩種應該第一種用戶會更容易中招一點，由於用戶關鍵的必定是根據他搜索關鍵詞後的結果，並且搜索結果會把關鍵字以紅色高亮，很容易讓用戶忽略最底下的推廣二字，插件

第二種雖然沒有加推廣二字，可是把廣告結果以底色加亮提示，雖然沒什麼卵用，但至少是有提示了3d

另外針對同一關鍵詞重複搜索3-5次後廣告就再也不會出現，這一點還算是有一點良心。但TM有毛用啊，誰會一直點啊......code

三分析與實現

瞭解了百度廣告的展示形式後接下來就分析它的html

1 先看推廣字段的 html，若是是廣告的結果 div的 id 都是以數字命名，因此在判斷時只要判斷是不是數字就行

2 推廣連接廣告html 廣告的結果會被包含在 content_left 第一級的div中只須要判斷該div下的 a 標籤的text屬性是否等於 "推廣連接" 而後廣告div的id是否爲數字便可

3 代碼怎麼實現已經知道了碼代碼就好了

//廣告背景色加深
 function changeBackgroundColor()
 {
     var url = window.document.location.href;
     if(url.indexOf("www.baidu.com")>0)
     {
         var searchResult = $("#content_left").children("div");
         
         searchResult.each(function(){
             //驗證是否爲廣告結果(若是爲廣告id 會是 3001 這種數值)
             if(typeof($(this).attr("id")=="number")|| )
             {
                                  
                 //以"推廣"字段的廣告
                 var div = $(this);
                 $(this).find("font").each(function(){
                     var text =$(this).find("a").text();

                    if(text=="推廣")
                     {
                        div.css("background-color","#FEC2C3") ; 
                     }

                 })
             
             }else if($(this).children("a").text()=="推廣連接")
             {
                //以"推廣連接"字段的 廣告
                $(this).css("cssText","background-color:#FEC2C3 !important; ");
                         
             }
             
         })
     }
     
 }