一直听说油猴(tampermonkey)是一个很强大的插件,但是自从装上之后一直在角落里吃灰,从来都没有启用过,今天无意中看到了一两个不错的脚本推荐,可以去除视频广告和VIP解析。所以就把它从墙角拉出来用了。嗯,真香!
有时候查询问题的需要,总是用到CSDN论坛,但每次的点击显示更多真的很是烦人,虽然网上也有自动显示更多的脚本,但耐不住强烈的好奇心,所以想着写一些自己用着习惯的网页脚本。所以就开始了这次的探索之路。
首先在Chrome中F12打开调试模式,找到按钮。想着添加一个click事件就可以解决这个问题,但尝试的时候发现不知道怎么在油猴中填写自己的代码,使写的脚本能够在相应的网站中生效。于是就有了早上醒来的第一次代码尝试:
// ==UserScript==
// @name csdn自动显示更多
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match *://blog.csdn.net/
// @grant none
// ==/UserScript==
(function() {
'use strict';
if(location.hostname == "blog.csdn.net"){
$(".btn-readmore").click();
}
})();
在实际运行中,发现并没有生效。于是就以失败告终,8:15分安心的去上班了。
下班后开始第二次尝试,觉得代码应该没什么问题啊,就开始考虑打开网页时,脚本和页面元素的加载顺序,是否能够选择到元素。上网查了一堆资料,无意中发现问题还是出现在检测网站的匹配上。*://blog.csdn.net/不能匹配到网址。修改后的代码:
// ==UserScript==
// @name csdn自动显示更多
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match *://blog.csdn.net/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
if(location.hostname == "blog.csdn.net"){
$(".btn-readmore").click();
}
})();
就是因为一个正则匹配的*号问题,导致脚本没有执行。
通过这次的尝试,也为自己打开了脚本编写的大门吧,其实之前学习前端相关知识的时候就在想能不能让页面有一些自己添加的元素在上面。使之能够更加符合自己的使用习惯,同时提高自己的效率,现在看到了大门,我希望能够在之后的学习中学到更加多的脚本知识。
我们的每一次尝试,都是在一步步的壮大自己!
网友评论