|
本节主要内容:
视频加速与时间加速,会写一个用于:http://time.tianqi.com/的时间加速和用于bilibili的一个视频倍速:https://www.bilibili.com/video/BV1ys411p7To
时间加速例子已经失效,请去http://110.42.220.200/time.html实战
时间加速
首先来介绍一下时间加速的原理.一般情况下,都是使用setInterval来做定时器,我们只要把这个定时器的时间缩短,比如之前是1s触发一次,现在变成500ms触发一次,那么就相当于时间缩短了一倍.
怎么缩短呢?我们可以劫持setInterval这个函数,传入值为1000,我们把他变为500.代码类似下面这样:
```
let hookSetInterval=window.setInterval;//将系统提供的setInterval保存
window.setInterval=function(a,b){//将系统的setInterval替换为我们自己的
return hookSetInterval(a,b/2);//经过处理后再调用系统的setInterval
}
```
在脚本中也是类似的代码,不过如果使用//@grant unsafeWindow的话,window替换为unsafeWindow,
视频倍速
视频倍速的话,其实也很简单,主要牵扯到h5的video,里面有一个播放速度的属性:playbackRate,最高为16倍.
https://developer.mozilla.org/zh ... lement/playbackRate
像b站这个页面,里面只有一个视频,我们直接document.querySelector('video')就可以获取到了,如果有多个选择器写好也没问题.代码如下:
```
document.querySelector('video').playbackRate=2;
```
RUN-AT
注意这里还有一个比较重要的属性:// @run-at,:https://www.tampermonkey.net/documentation.php#_run_at
主要是设置脚本运行的时候.这里我们设置为:// @run-at document-start 希望脚本尽快的被注入,因为我们要抢在前端调用setInterval之前来替换掉setInterval函数.
脚本
知道上面的做法后,脚本也很容易写了,这次我们再来复习下之前的unsafeWindow和//@match.
代码我另外发帖了:https://bbs.tampermonkey.net.cn/thread-179-1-1.html
|
|