教你怎麽屏蔽寬帶商的流氓廣告
阿新 • • 發佈：2017-05-22
簡單 寬帶 font 們的 ada pac pan microsoft 最後一個元素
（點擊查看大圖）
我們使用火狐瀏覽器的代碼調試窗口，發現，在頁面的尾部無端多出來很多iframe和嵌入有廣告代碼的div。很顯然，這些代碼並不是36kr放置的。它是寬帶商捕捉用戶瀏覽的網頁，擅自非法的這些頁面上添加自己的廣告服務代碼。這些代碼能給寬帶商帶來一筆額外的收入。
（點擊查看大圖）
對於站長來說，這些廣告很討厭，用戶會認為這些都是網站站長投放的。站長背了黑鍋，而且沒得到任何好處，更重要的，影響了在用戶心中的形象，流失了用戶。
站長應該維權，但站長是弱勢群體，維權路上很難成功。那麽，我們只能自己想辦法，我們可以通過技術的手段，在頁面代碼裏做一些改動，阻攔或屏蔽這些寬帶商非法嵌入的代碼。
我發現，寬帶商非法嵌入的廣告代碼通常是兩種形式，一種是在頁面尾部加入數個iframe，iframe裏的內容是寬帶商承攬的廣告；另外一種形式是直接嵌入div
，div裏嵌入一些html代碼和js，最終呈現的內容還是寬帶商承攬的廣告。
但無論是iframe還是div，這些HTML廣告代碼都有相同的特征。
首先說說iframe形式，這些iframe在頁面文檔中的位置一定都是 body元素的直接子元素，用CSS 選擇器可以這樣表示：
body > iframe{....}
以我個人的經驗，一般正常的頁面裏很少有使用iframe的，即使有，也很少有將iframe直接放到body元素下的。所以，對於這些流氓寬帶商非法嵌入的iframe，我們可以通過下面的CSS進行屏蔽：
body > iframe{opacity:0;display:none;}
把這段代碼放入頁面裏，這非法嵌入的廣告iframe，雖然存在，但完全看不見。
對於第二種情況，也就是div形式的廣告，我發現這些div通常會放置在頁面的最後，也就是頁面裏正常HTML元素的最後一個的後面。如果我們的頁面裏最後一個元素是:
<div id=‘last-div‘></div>
，則就要其後非法插入的廣告代碼的CSS選擇可以是這樣：
div#last-div ~ div {。。。。}
，只要能捕捉目標，我們就能消滅它們，隱藏這些非法入侵者的代碼很簡單，跟上面消滅iframe的方式一樣：
div#last-div ~ div {display: none; opacity:0;}
將上面這這種代碼一起放到頁面裏的CSS文件裏，黑心的寬帶商非法插入的廣告就無法顯示，我只是小範圍的測試了一下，效果很好，但很有可能還有更多沒有考慮到的情況。如果你知道這種方法有遺漏的地方，或者有更好的方法，請告訴我，在下面留言，或發郵件給我，謝謝
如果屏蔽頁面上的廣告？對於普通用戶來說，使用AdBlock插件是最佳選擇(針對火狐瀏覽器和谷歌瀏覽器用戶，不知道IE瀏覽器容易如何處理這樣的問題)。
沒有人喜歡廣告，但在互聯網上，絕大多數網站的主要來源只有廣告，如果沒有廣告收入，這些網站基本上都會倒閉。
為了在投放放過和不騷擾用戶之間取得平衡，很多站長是很有克制在頁面上投放少量的廣告。但站長們的這些良苦用心往往會被一些流氓寬帶商的惡意行為給粉碎了。幾乎所有的寬帶商(聯通寬帶、電信寬帶、移動寬帶、長城寬帶、方正寬帶等)都會在用戶使用它們的寬帶服務瀏覽網頁時，在這些網頁的頁面上強行嵌入自己的廣告服務。
以大家熟知的36kr網站為例子來說明這個問題。我使用的是方正寬帶，當用戶訪問36kr網站的頁面時，正常情況下，36kr網站的頁面是沒有放置廣告的，更不會在頁面的右下角彈出廣告。但當使用方正寬帶訪問36kr網站時，你就會發現頁面右下角有廣告彈出。
（點擊查看大圖）
我們使用火狐瀏覽器的代碼調試窗口，發現，在頁面的尾部無端多出來很多iframe和嵌入有廣告代碼的div。很顯然，這些代碼並不是36kr放置的。它是寬帶商捕捉用戶瀏覽的網頁，擅自非法的這些頁面上添加自己的廣告服務代碼。這些代碼能給寬帶商帶來一筆額外的收入。
（點擊查看大圖）
對於站長來說，這些廣告很討厭，用戶會認為這些都是網站站長投放的。站長背了黑鍋，而且沒得到任何好處，更重要的，影響了在用戶心中的形象，流失了用戶。
站長應該維權，但站長是弱勢群體，維權路上很難成功。那麽，我們只能自己想辦法，我們可以通過技術的手段，在頁面代碼裏做一些改動，阻攔或屏蔽這些寬帶商非法嵌入的代碼。
我發現，寬帶商非法嵌入的廣告代碼通常是兩種形式，一種是在頁面尾部加入數個iframe，iframe裏的內容是寬帶商承攬的廣告；另外一種形式是直接嵌入div
，div裏嵌入一些html代碼和js，最終呈現的內容還是寬帶商承攬的廣告。
但無論是iframe還是div，這些HTML廣告代碼都有相同的特征。
首先說說iframe形式，這些iframe在頁面文檔中的位置一定都是 body元素的直接子元素，用CSS 選擇器可以這樣表示：
body > iframe{....}
以我個人的經驗，一般正常的頁面裏很少有使用iframe的，即使有，也很少有將iframe直接放到body元素下的。所以，對於這些流氓寬帶商非法嵌入的iframe，我們可以通過下面的CSS進行屏蔽：
body > iframe{opacity:0;display:none;}
把這段代碼放入頁面裏，這非法嵌入的廣告iframe，雖然存在，但完全看不見。
對於第二種情況，也就是div形式的廣告，我發現這些div通常會放置在頁面的最後，也就是頁面裏正常HTML元素的最後一個的後面。如果我們的頁面裏最後一個元素是:
<div id=‘last-div‘></div>
，則就要其後非法插入的廣告代碼的CSS選擇可以是這樣：
div#last-div ~ div {。。。。}
，只要能捕捉目標，我們就能消滅它們，隱藏這些非法入侵者的代碼很簡單，跟上面消滅iframe的方式一樣：
div#last-div ~ div {display: none; opacity:0;}
將上面這這種代碼一起放到頁面裏的CSS文件裏，黑心的寬帶商非法插入的廣告就無法顯示，我只是小範圍的測試了一下，效果很好，但很有可能還有更多沒有考慮到的情況。如果你知道這種方法有遺漏的地方，或者有更好的方法，請告訴我，在下面留言，或發郵件給我，謝謝
教你怎麽屏蔽寬帶商的流氓廣告