前文
之前我们做过了抖音的视频提取脚本
我们这节课可以实践一些键盘的事件监听
为什么使用事件监听？
因为我没事找事！
开始
首先我们想完成两个目标
1.按键自动滚动到底部，并且返回到顶部
2.按键自动全选所有视频，或取消所有视频
先来做滚动吧
首先我们假设监听Ctrl+方向下键以及Ctrl+A这两个快捷键作为功能触发按键
unsafeWindow.addEventListener('keydown', (evt)=>{
console.log('evt',evt);
});
我们先打印一下看看
这里我选择在按下键的时候进行监听
这里着重注意的就是keyCode，ctrlKey，shiftKey，altKey
keyCode是我们按键的按键码，而ctrl，shift，alt，那三个键值，代表你按键的时候是否按了对应的功能键
可以看到我按了Ctrl+↓的时候ctrlKey是true的
然后是选择全部视频的按键，我突然想起来ctrl+a会选择页面全部文本
所以临时更改为ctrl+z
可以看到键码为90，所以这里我们可以开始写一下了
unsafeWindow.addEventListener('keydown', (evt)=>{
if(evt.ctrlKey){
if(evt.keyCode==40){
//开始设置滚轴
JumpToBottom()
}
if(evt.keyCode==90){
//选择或取消全部视频
}
}
});
我们先写滚轴到下最后直接跳到顶部
我们直接先写一下滚轴代码吧
这里我用了setinterval循环，以及一个状态用来防止多次按键鼠标
let jumprun=false;
function JumpToBottom(){
if(jumprun==true){
return;
}
jumprun=true;
let timer=setInterval(()=>{
debugger;
let bottomdiv=document.querySelector('.knrjsN15 .VxGqO7jM')
if(bottomdiv!==null){
if(bottomdiv.innerText==='暂时没有更多了'){
unsafeWindow.scrollTo(0,0)
jumprun=false;
clearInterval(timer)
return;
}
}
unsafeWindow.scrollTo(0,document.body.scrollHeight)
},300)
}
接下来我们来做选择全部的按键功能
unsafeWindow.addEventListener('keydown', (evt)=>{
if(evt.ctrlKey){
if(evt.keyCode==40){
//开始设置滚轴
JumpToBottom()
}
if(evt.keyCode==90){
//选择或取消全部视频
SelectAllVideo()
}
}
});
我们直接获取视频数量，跟选中数量进行对比，然后判断选中全部还是取消全部
最后模拟用户的选择状态，以及触发onclick函数
代码如下
function SelectAllVideo(){
let alltarget=document.querySelectorAll('.control-pos input')
let successnum=Object.keys(saveurl)
let setstatus=false
if(successnum.length===alltarget.length)
{
//取消全部
setstatus=false
}else{
//选择全部
setstatus=true;
}
alltarget.forEach((item)=>{
item.checked=setstatus;
item.parentElement.onclick()
})
}
那么到这里我们就完成了抖音视频下载加强版！
结语
撒花~
置顶卡
沉默卡
照妖镜
