代码可以在 https://pan.baidu.com/s/1uN120-18hvAzELpJCQfbXA  处下载

下面来 移除 广告元素,在js目录下,创建一个 removeAds.js, 用来移除网页中的广告元素

修改manifest.json

 1 "content_scripts":[{
 2         "js": [
 3             "js/BaseJs/jquery.min.js",
 4             "js/BaseJs/RoomObj.js",
 5             "js/removeRoom.js",
 6             "js/paizidanmu.js",
 7             "js/removeAds.js",
 8             "js/content_scripts.js"
 9         ],    //要注入的js
10         …
11     }]

同时, 发现了一个问题,如果打开的是 https://www.douyu.com/g_wzry  符合,"matches": ["https://www.douyu.com/*"] 的规则,就会执行所有 注入的js脚本,但是js\paizidanmu.js  获取 roomId时,js\BaseJs的getRoomId 方法就会出错,所以try ..catch一下,

 1 //获取房间id
 2     this.getRoomId = function () {
 3         try{
 4             var roomUrl = $("link[rel='canonical']")[0].href;
 5             var roomUrlArr = roomUrl.split("/");
 6             return roomUrlArr[3];
 7         }catch(err){
 8             return "";
 9         }
10     };

 

我们发现,需要注入脚本都写在了 页面加载之后 调用其他方法执行操作,这样,我们可发判断roomId 如果为空(不是直播房间页面),则跳出,节省硬件资源,防止产生错误。

paizidanmu.js

window.οnlοad=function(){roomId = roomObj.getRoomId();if (roomId =="") {return}…
};

removeAds.js 用来 移除 广告元素,每个人 都有自己的喜好,这里,我只是按自己的 喜好移除元素的,大家可 自行修改。有的元素加载慢,我用了 循环,循环10次后终止。

并添加了 3 个 按钮,用来提升 观看体验

1.隐藏\显示头部信息

2.显示\隐藏 排行榜,隐藏时,会获取更多的弹幕视野。

3.显示\隐藏 直播公告 ,如果打开页面且直播公告为空,则自动 隐藏。

removeAds.js 完整代码 如下

  1 var removeAdsIndex =0;
  2 function removeAds() {
  3     var removeAdsTimer=self.setInterval(function(){
  4         if (removeAdsIndex>=10) {
  5             window.clearInterval(removeAdsTimer);
  6         }
  7         $("#left").remove();    //左边侧栏
  8         $(".recommendApp-cbeff7").remove();    //下载斗鱼APP
  9         $(".live-room-normal-left").remove();    //视频下方广告
 10         $(".yuba-group-active").remove();    //悬浮主播头像,小组动态
 11         $(".recording-wrap").remove();    //TA的视频
 12         $(".sq-wrap").remove();    //分享按钮
 13         $(".column.rec").remove();    //主播也爱看
 14         $(".ft-sign-cont").remove();    //任务区,网页游戏推广
 15
 16         $(".showdanmu-f76338").click();    //关闭弹幕
 17         removeAdsIndex++;
 18     },1000);
 19 };
 20 //进行一些页面排版修改
 21 function youhua() {
 22     $("#header").hide();    //隐藏头部
 23     setFont();
 24     $("#header").css("border-bottom-width","0px");
 25     $("#mainbody").css("margin-top","0px");    //"50px"
 26     $("#mainbody").css("padding-top","0px");    //"20px"
 27     // 视频    区域
 28     $("#anchor-info").css("border-top-width","0px");    //"1px"
 29     $("#anchor-info").css("border-left-width","0px");    //"1px"
 30     $("#anchor-info").css("border-right-width","0px");    //"1px"
 31     $("#anchor-info").css("border-bottom-width","0px");    //"1px"
 32     $("#anchor-info").css("margin-bottom","2px");    //"10px"
 33     //任务 、背包
 34     $("#js-stats-and-actions").css("padding-top","4px");    //"14px"
 35     $("#js-stats-and-actions").css("padding-bottom","2px");    //"7px"
 36     $("#js-live-room-normal-equal-right").css("margin-top","0px");    //"24px"
 37 };
 38
 39 function delayInset() {
 40     //添加 排行on/off 按钮
 41     var span =document.createElement("span");
 42     span.innerHTML = "排行on";
 43     var ii =document.createElement("i");
 44     ii.setAttribute("class","icon");
 45     var a =document.createElement("a");
 46     a.setAttribute("href","javascript:;");
 47     a.setAttribute("id","fansRankId");
 48     a.appendChild(ii);
 49     a.appendChild(span);
 50     document.getElementsByClassName("chat-cls")[0].appendChild(a);
 51     document.getElementById("fansRankId").onclick = function(){
 52         var fansRan =$("#fansRankId span");
 53         if (fansRan.text() == "排行off") {
 54             fansRan.text("排行on");
 55             $("#js-fans-rank").show();    //粉丝贡献榜
 56             $("#js-chat-cont").css("top","217px");    //"217px"
 57         }else{
 58             fansRan.text("排行off");
 59             $("#js-fans-rank").hide();    //粉丝贡献榜
 60             $("#js-chat-cont").css("top","2px");    //"217px"
 61         }
 62     };
 63
 64     //添加 隐藏\显示头部信息 按钮
 65     var a =document.createElement("a");
 66     a.innerHTML = "隐藏头部信息";
 67     a.setAttribute("href","javascript:;");
 68     a.setAttribute("id","headInfoId");
 69     document.getElementsByClassName("r-else clearfix")[0].appendChild(a);
 70     document.getElementById("headInfoId").onclick = function(){
 71         setFont();
 72         var headInfo =$("#headInfoId");
 73         if (headInfo.text() == "显示头部信息") {
 74             headInfo.text("隐藏头部信息");
 75             $("#header").hide();    //隐藏头部
 76         }else{
 77             headInfo.text("显示头部信息");
 78             $("#header").show();    //隐藏头部
 79         }
 80     };
 81
 82     //添加 on\of  显示\隐藏直播公告 按钮
 83     var a =document.createElement("a");
 84     a.innerHTML = "on";
 85     if ($(".column-cotent").text() =="") {
 86         $(".live-room-normal-right.fl").hide();    //直播公告
 87         a.innerHTML = "off";
 88     }
 89     a.setAttribute("href","javascript:;");
 90     a.setAttribute("id","roomAnnounceId");
 91     document.getElementById("js-shie-gift").appendChild(a);
 92     document.getElementById("roomAnnounceId").onclick = function(){
 93         var roomAnnounce =$("#roomAnnounceId");
 94         if (roomAnnounce.text() == "on") {
 95             roomAnnounce.text("off");
 96             $(".live-room-normal-right.fl").hide();
 97         }else{
 98             roomAnnounce.text("on");
 99             $(".live-room-normal-right.fl").show();
100         }
101     };
102 };
103 // 斗鱼的其他js,触发一些事件会修改回原来的字体样式,所以放在了点击状况信息时,修改一次字体
104 function setFont() {
105     $(".cs-textarea").css("font-size","14px"); //文字输入区  字体
106     $(".cs-textarea").css("font-weight","bold");//文字输入区  字体加粗
107 }
108 $(document).ready(function(){
109     if (roomObj.getRoomId() =="") {
110         return;
111     }
112     removeAds();
113     var youhuaTimer=setTimeout("youhua()",3000);
114     var delayInsetTimer = setTimeout("delayInset()", 2500);
115 });

 

修改完毕,同步 代码。。。。。

转载于:https://www.cnblogs.com/likehc/p/9419502.html

斗鱼扩展--移除广告优化页面(五)相关推荐

  1. 斗鱼扩展--拦截广告,让网页加载更快(四)

    代码可以在 https://pan.baidu.com/s/1uN120-18hvAzELpJCQfbXA  处下载 有些广告的 图片,从请求到 下载到本地后加载,让网页加载速度变慢,其实我也不怎么看 ...

  2. 计算广告:第五章——搜索与竞价广告

    计算广告:第五章--搜索与竞价广告 一.搜索广告 1.搜索广告产品形态 2.搜索广告产品新形势 3.搜索广告产品策略 4. 产品案例 二.位置拍卖与机制设计 1.定价问题 2.市场保留价 3.价格挤压 ...

  3. 做SEO优化第五步:定位目标关键词和长尾关键词

    通常,我们在给网站选择关键词的时候除了要定位网站的目标关键词之外,还需要给网站选择几个长尾词,而且在优化的过程中,做好长尾关键词的排名也是非常重要的,当长尾词的排名上去了之后,也能够给网站带来可观的流 ...

  4. 360极速浏览器去广告优化版 v13.0.2101.0

    每台电脑都会安装那么一个或者多个浏览器共同使用,但是有一个好的浏览器能够带给用户很好的体验,今天为大家带来的是360极速浏览器去广告优化版,这是星空优化而来的版本,已删除360医生.升级库.反馈.36 ...

  5. 互联网广告系统综述五系统架构

    互联网广告系统综述五系统架构 声明: 1)该博文是整理自网上很大牛和专家所无私奉献的资料的.具体引用的资料请看参考文献.具体的版本声明也参考原文献 2)本文仅供学术交流,非商用.所以每一部分具体的参考 ...

  6. 斗鱼扩展--让你看到更多内容(七)

    代码可以在 https://pan.baidu.com/s/1uN120-18hvAzELpJCQfbXA  处下载 下面我们一步优化页面,在一个页面上减少 广告的同时,也能获取更多的信息. 我直接上 ...

  7. 《C++应用程序性能优化::第五章动态内存管理》学习和理解

    <C++应用程序性能优化::第五章动态内存管理>学习和理解 说明:<C++应用程序性能优化> 作者:冯宏华等 2007年版. 2010.8.29 cs_wuyg@126.com ...

  8. 数据监测驱动下的信息流广告优化

    信息流广告是什么 "今日头条和百度必有一战",相信不少的互联网人在过去几个月都听到过类似的断言.定位于信息分发平台的今日头条和主营搜索业务的百度会产生如此大的利益冲突,最核心的点其 ...

  9. 搜索引擎排名优化与五个技巧详解

    对于搜索引擎排名,每个SEO人员都有自己的独门秘籍,通常它都会根据自己所处的行业,进行有针对性的优化,但万变不离其宗,对于任何行业,它的排名机制,都是建立在满足一定搜索需求的基础之上. 言外之意,万丈 ...

  10. 百度快照优化推广五大坑

    百度快照优化推广五大坑 近几年由于互联网高度普及,消费者搜索习惯一般不仅仅只是单一关键词搜索,消费者在搜索想要结果时候,往往都会进行多次搜索,以求搜索结果的精准性.所以目前市场上绝大部分互联网企业都纷 ...

最新文章

  1. java报错MalformedURLException: unknown protocol: c
  2. 二十六、内存管理的概念
  3. 计算机ui答辩,KGUT1027 班级UI设计第一阶段成长答辩开始啦
  4. linux服务 Systemd 简介
  5. [iPhone高级] 基于XMPP的IOS聊天客户端程序(IOS端二)
  6. 小程序音视频能力技术负责人解读“小程序直播”
  7. SQL Servr 2008空间数据应用系列一:空间信息基础
  8. SystemVerilog中根据系统时间产生随机数的函数
  9. CodeForces - 589D
  10. python静态方法的作用_@staticmethod和@classmethod如何作用于python中的...
  11. 关于内存的最后一个难点--the paged and the non-paged pool
  12. Xcode调试技巧总结
  13. PS怎么用3D功能怎么用?如何用PS做立体字
  14. 开发调试指令大全--(博通开发调试命令)
  15. VS2010 提示存储空间不足 无法操作
  16. mininet sflow 资料和经验
  17. Unity 大面积草风吹动效果+受人物影响
  18. 哈师大计算机学院2016级新生,【通知公告】哈尔滨师范大学2016—2017学年度国家励志奖学金获奖学生初审名单公示...
  19. 智能音箱硬件和软件介绍[上] 硬件结构解析[Soomal]
  20. 【分布式系统】分布式事务(2PC 3PC TCC 最终一致性)

热门文章

  1. bps(bits per second)
  2. 如何成为一名自豪的游戏程序员
  3. 文件大小单位换算(B-GB)
  4. HTTP和AJAX重点知识
  5. Computer Vision_3D Reconstruction_Point Cloud(计算机视觉三维重建点云点云配准)
  6. 8-子午和卯酉圈曲率半径
  7. python xlsx转xls_Python将xls转换成xlsx
  8. c语言 code table,单片机C语言unsigned char code table是什么意思?
  9. 阿里巴巴JAVA代码规范三【考题】
  10. 党团学系统前后端接口文档