1987WEB视界-分享互联网热点话题和事件

您现在的位置是:首页 > WEB开发 > 正文

WEB开发

通过加速或跳过网页视频解决进度条无法拖动问题

1987web2024-03-25WEB开发51
加速网页视频与跳过网页视频1、加速网页视频(1)F12打开开发者工具,然后Ctrl+Shift+C检查video元素检查video元素(2)控制台输入脚本

加速网页视频与跳过网页视频1、加速网页视频(1)F12打开开发者工具,然后Ctrl+Shift+C检查video元素检查video元素(2)控制台输入脚本

function accelerate() {let video = document.querySelector(‘video’);function play() {video.playbackRate = 15; // 加速至原速的15倍video.play();}setInterval(play, 100); // 定时播放,防止被js恢复原速或暂停}accelerate()

注意,视频倍速有一定限制,超过一定限制会报错,我的是最高15或16倍速,可自行调试。

2、跳过网页视频(1)同上,F12打开开发者工具,然后Ctrl+Shift+C检查video元素(2)控制台输入脚本function skip() {let video = document.querySelector(‘video’);video.currentTime = video.duration;/*duration获取视频时长,currentTime是视频当前的播放时间,通过重置currentTime跳过视频有时会出现卡顿,可考虑保留几秒缓冲考虑使用:video.currentTime = video.duration - 3 ; //播放缓冲为3秒*/

}skip()

以上方法仅仅提供了视频快进与跳过的思路,真实情况要稍微复杂一些。

以上方法仅适用于网页上只有单个video标签的情况(比如爱奇艺、网课),如果网页上有多个video标签(比如优酷),就要根据实际情况作进一步修改,而且针对不同网站,处理的方法也有所差异。

3、视频加速适用于爱奇艺、优酷

var interval_idfunction accelerate() {let video = document.getElementsByTagName(‘video’);for (let i=0; i

适用于网课

function accelerate() {let video = document.getElementsByTagName(‘video’);for (let i=0; i

var interval_idfunction skip() {let video = document.getElementsByTagName(‘video’)for (let i=0; i