如何在HTML5中更改视频的播放速度？

Question

如何更改HTML5中的视频播放速度？我已经在w3school检查了video tag's attributes但是无法接近那个。非常感谢你的帮助！

Answer 1

根据this site，playbackRate和defaultPlaybackRate属性支持此功能，可通过DOM访问。例如：

/* play video twice as fast */
document.querySelector('video').defaultPlaybackRate = 2.0;
document.querySelector('video').play();

/* now play three times as fast just for the heck of it */
document.querySelector('video').playbackRate = 3.0;

以上works在Chrome 43 +，Firefox 20 +，IE 9 +，Edge 12 +上。

Answer 2

输入

document.querySelector('video').playbackRate = 1.25;

在现代浏览器的JS控制台中。

Answer 3

在 chrome 中，创建一个新书签

输入任意名称，例如速度选择器，然后在 URL 中输入以下代码

javascript: var speed = prompt("请输入速度", "1");document.querySelector('video').playbackRate = speed,void(0);

然后当你点击这个书签时，会出现一个弹出窗口，你可以输入视频的速度

Answer 4

您可以使用以下代码：

var vid = document.getElementById("video1");

function slowPlaySpeed() { 
    vid.playbackRate = 0.5;
} 

function normalPlaySpeed() { 
    vid.playbackRate = 1;
} 

function fastPlaySpeed() { 
    vid.playbackRate = 2;
}

Answer 5

（在YouTube上播放视频时在Chrome中进行了测试，但应该可以在任何地方使用-对加速在线培训视频特别有用）。

对于任何想要将它们作为“书签”（书签）添加到您的浏览器的人，请使用这些浏览器书签名称和URL，然后将以下每个书签添加到浏览器的顶部：< / p>

名称： 0.5x
URL：

javascript:

document.querySelector('video').playbackRate = 0.5;

名称： 1.0x
URL：

javascript:

document.querySelector('video').playbackRate = 1.0;

名称：1.5x
URL：

javascript:

document.querySelector('video').playbackRate = 1.5;

名称： 2.0x
URL：

javascript:

document.querySelector('video').playbackRate = 2.0;

参考文献：

1. main answer by Jeremy Visser
2. 从我的GitHub要旨中复制：https://gist.github.com/ElectricRCAircraftGuy/0a788876da1386ca0daecbe78b4feb44#other-bookmarklets
   1. 也可以在此处获取其他书签，例如在GitHub上帮助您。

Answer 6

假设您的视频/音频 ID 是 myVideo，那么您可以简单地使用 JavaScript 来完成您想做的事情，只需输入以下简单的 JS 代码：-

var vid = document.getElementById("myVideo");
vid.playbackRate = 0.5;`

这会将视频/音频的速度降低到一半。

播放速度

表示音频/视频的当前播放速度。

示例值：

1.0 is normal speed

0.5 is half speed (slower)

2.0 is double speed (faster)

-1.0 is backwards, normal speed

-0.5 is backwards, half speed

来源：w3schools.com

Answer 7

我更喜欢对视频速度进行更精细的调整。我喜欢能够根据命令加快和减慢视频速度。因此我使用这个：

window.addEventListener("keypress", function(e) {
  if(e.key==="d") document.getElementsByTagName("video")[0].playbackRate += .1; else if(e.key==="s") document.getElementsByTagName("video")[0].playbackRate -= .1;
}, false);

按 d 加速，按 s 减速。

Answer 8

只需在浏览器的 javascript 控制台中键入以下命令：

document.querySelector('video').playbackRate = 2.0;

您可以通过从右键单击菜单中选择检查选项来获取它，如下所示：

Answer 9

javascript:document.getElementsByClassName("video-stream html5-main-video")[0].playbackRate = 0.1;

您可以在此处输入任何数字，只是不要走太远，以免影响计算机。