当你浏览技术网站的时候,是否为阻挡眼前的窗口烦心?用AD程序会常常会导致图片没了,但是空白的障碍却占领了原来的地方。
▼
我们不去探究网易的产品经理是基于如何的心理设计的这个严重影响用户体验的东西,只需要去干掉它即可。
其是这种NC的情况屡见不鲜,之前优快云在博客右边挂一个随风飘荡的二维码也是一例。
那么作为勤劳勇敢的程序猿是如何与让自己眼不见为净呢?
快跟我来Step By Step为它们做手术,净化眼球:
1下载油猴子
去你所使用的浏览器的插件商店里搜索:油猴子
这是一个著名脚本平台,是我们此行的手术台。
2找出那个碍眼的东西
以火狐为例,右键你需要处理的页面,“查看元素”:
▼
弹出下面的查看器窗口,在点击左边的代码页面会将该代码表示的内容用灰色标记出来,直到像下图这样,我找到它了!这个碍眼的家伙所用的代码
▼
比如对方的代码是这样的:
<div class="m-regGuideLayer f-trans js-show-regGuideLayer" id="laji"></div>
那我们可以使用以下代码完成任务
var str=getElementsByTagName("div");//获取检索内容块
for(var i=0;i<str.length;i++)//遍历内容块
if(str[i].className=="m-regGuideLayer f-trans js-show-regGuideLayer")//判断类名
str[i].style.display="none"; //满足条件内容隐藏显示
也可以使用这样的代码完成任务:
var str=getElementsByTagName("div");//获取检索内容块
for(var i=0;i<str.length;i++)//遍历内容块
if(str[i].id=="laji")//判断类名是否为laji
str[i].style.display="none"; //满足条件内容隐藏显示
当然如果对方使用了容易让人混淆的名字,比如这个id所处被使用,我们需要减小范围:
<div id="f1">//外层div包,用于js代码定位
<div class="zzz">t1</div>
<div class="zzz">t2</div>
<div class="zzz">t3</div>
<div class="zzz">t4</div>
</div>
//用下面的代码
<script>
var list=document.getElementById("f1");//获取检索范围
var str=list.getElementsByTagName("div");//获取检索内容块
for(var i=0;i<str.length;i++)//遍历内容块
if(str[i].className=="zzz")//判断类名
if(str[i].innerHTML=="t1")//判断内容是否为指定
str[i].style.display="none"; //满足条件内容隐藏显示
</script>
竟然发现网易博客打开后不是第一时间显示这个碍眼的东西,而是我们一滚动进度条就开始弹出,难道我们要延时?还是继续找对方是怎么响应滚动事件?当然不是
我们这么改:
▼
window.onscroll = function ()//滚动条滚动的时候执行下面的代码
{
var str=document.getElementsByTagName("div");//获取检索内容块
for(var i=0;i<str.length;i++)//遍历内容块
if(str[i].className=="m-regGuideLayer f-trans js-show-regGuideLayer")//判断类名是否是碍眼的
str[i].style.display="none"; //满足条件内容隐藏显示
}
代码有了然后呢?
将上面的6行代码复制一下:
打开前面下载的油猴子-》新建用户脚本
弹出如下:
随意输入,
▼
粘贴代码进来:
▼
刷新网易博客,碍眼再也不回来了
这是我第一次写实用js脚本吧。
技术让人更自由。
本文章的诞生是在学习包括但不限于以下文章得到的灵感完成的:
1. 通过判断Class的值用getElementByClassName隐藏Div元素-百度知道-zzc384490
2. 去广告/去除百度推广以及无用功能-脚本-作者:papipapipia
3. w3school
油猴子通过自定义的js代码来自由安排网页上的东东。可不可以做个马……

本文介绍了一种使用JavaScript脚本去除网页中烦人元素的方法,包括查找特定元素、编写隐藏代码,并利用油猴子插件实现自动化操作。
742

被折叠的 条评论
为什么被折叠?



