公司市面上有一套产品,且学校有对应教学教材,学校偶尔会用来做实操比赛,由于比赛系统是在产品外层包了一层壳(iframe嵌入产品)来实现实操,内部产品直接使用的线上正式版,产品经常做一些营销活动,会弹出一些花里胡哨的广告,如果在学校里比赛场景中弹广告有损赛场纪律和严肃性,但与开发团队沟通去掉广告也很难做到,各部门之间也是你不情我不愿的。
作为程序员,遇到这类问题时首先想到了是不是可以通过技术解决?于是乎查资料,试验,最终找到了解决问题的方法。那就是通过谷歌浏览器的插件(Extension)来实现删除广告DOM。
程序会在页面加载完后利用元素选择器获取元素后调用remove()函数直接删除广告元素。
按以下目录结构建目录或文件:
RemoveDOM
+ src // 源代码目录
+ images
+ icon.png // 扩展程序的图标
+ js
+ main.js // 主程序,可随意命名,需要配置到manifest.json中
+ manifest.json // 配置文件
mainfest.json配置代码:
{ "manifest_version": 2, "name": "RemoveDOM", "version": "1.0.0", "description" : "删除DOM", "icons": { "128": "src/images/logo.jpeg", "48": "src/images/logo.jpeg", "16": "src/images/logo.jpeg" }, "permissions": [ "*://*/*" ], "content_scripts": [ { "matches": ["http://*/*", "https://*/*"], // 作用于任何域名 "js": ["src/js/main.js"], "all_frames": true // 包括框架内网页也适用 } ] }
main.js:
setTimeout(() => { console.log('REMOVE DOM'); document.querySelector('.chanjet-nova-ui-base-dialog').remove(); }, 6000);
进入浏览器的扩展程序,打开开发者模式,将目录拖到浏览器里即可。
标签:src,插件,浏览器,js,images,广告,网页内容 From: https://www.cnblogs.com/jsper/p/17203727.html