Tampermonkey 脚本制作学习笔记#0x1
- 弹窗hollow word 制作:
match 属性：它的作用是匹配网站,表示通配// @match http:///*
// @match https://bbs.tampermonkey.net.cn/
alert('hollow word') //弹窗代码
document.querySelector('addr').value=''
ex:document.querySelector('#username_LvR4r').value='8888'
//PS: '#_id' or '.class'
document.querySelector("#cookietime_LH0yn").click()
document.querySelector("button.pn.pnc").click()
document.querySelector("video")
- h5的video,里面有一个播放速度的属性:playbackRate,最高为16倍
document.querySelector('video').playbackRate=2;
// 代码解释：@run-at ==>代码抢注
先鸽了，没咋看懂
enmm,看视频的那一会儿我大概懂了，下来看文字和代码又不懂了，先鸽，后面需要了在过来细看
-
外部资源引用
- 基于油猴 @require 属性 // 可以加MD5校验值
油猴加载
// @require https://github.com/sandoche/Darkmode.js
脚本加载
let script = document.createElement('script');
script.setAttribute('type', 'text/javascript');
script.src = "https://cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.min.js";
document.documentElement.appendChild(script);
小坑：
- 沙盒模式：可能由于加载的js文件操纵了window导致js文件发生冲突
- 原网页；可能由于原网页加载了js文件，与我们加载的js文件发生冲突（建议引用原网页）
区别：require下载到脚本，添加脚本，实时下载
Tampermonkey 脚本制作学习笔记：0x2
总结：原网页有就搁沙河加载，没有就原网页加载
- 存储数据：GM_setValue / GM_getValue
//@grant GM_setValue
//@grant GM_getValue
GM_setValue("123",qqq);
console.log(GM_getValue("123"));
基本原理：GM_addStyle函数是添加CSS到网页中
创建了一个style元素标签，并且将函数内容插入到网页当中
使用：
if(weburl.indexOf('www.imomoe.ai')!=-1)
{
GM_addStyle('#HMRichBox{display:none !important}')
GM_addStyle('#bdshare{display:none !important}')
}
!important==>增加权重 | 添加多条规则在第一条规则后用分号隔开
小知识：有点广告是在网页内加载，有的广告是在网页外加载
总结：相比于document.querySelector('[class="txp_ad"]').Style.display='none'，更加快捷//准确
）：
iframe匹配问题
document.querySelector('#g_iframe').contentWindow.document.querySelector
获取nodeList
document.querySelectorAll('#s-top-left .c-font-normal')
//#s-top-left ==>上层 .c-font-normal==>下层
- 循环筛选创建方法for
let list=document.querySelectorAll('.mnav')
for(let index=0;index<list.length;index++){
let item=list[index]
console.log(item.innerHTML)
if(item.innerHTML!=='贴吧'&&item.innerHTML!=='地图'){
item.remove()
}
- 去除推荐元素
GM_addStyle('#s-hotsearch-wrapper{display:none !important}')
Tampermonkey 脚本制作学习笔记：0x3
- 函数中的this：函数内的this一般是windows
function getthis(){console.log(cat对象,this)}
==>undefined
getthis() | getthis.call()
-
对象中的this：不在是原来，要搞对象
var testthis={showthis:function(){console.log('test对象',this)}}
miaomiaothis.showthis
- 对象转换：call和Apply
例子：
var cat={name:'小猫',eat:function(){console.log(this.name+'在吃饭')}}
var dog={name:'二哈'}
cat 拥有：name、eat-----------------==>cat.eat()-------------------==>小猫在吃饭
dog 拥有；name；但是这个函数在对象中,通过call就可以直接使用这个 对象（函数）
cat.eat.call(dog)
对象this本质上就是：showthis.call(testthis)，后面跟了一个函数，通过调用函数的方式来调用对象
var cat={name:'小猫',eat:function(){console.log(this.name+'在吃饭')}}
var dog={name:'小狗',eat:function(){cat.eat.call(this)}}
var cat={
name:'哆来A梦',
eat:function(){
return
()=>{console.log(this.name+'正在吃东西')}
}
}
setInterval(cat.eat(),3000)
总结：箭头函数可以使用，对象里的this，但是要在箭头函数外面套上一层function，以免穿透到外面
置顶卡
沉默卡
照妖镜
