最有效方式是设置 video.playbackrate，但需在 loadedmetadata 事件后操作，ios safari 要求用户手势触发，且必须用 js 属性赋值并读回验证。
直接设置 video.playbackRate 是控制 HTML5 视频播放速度最有效的方式，但它不是“设了就生效”的简单赋值——时机、平台限制、状态同步和容错处理共同决定了实际体验是否可靠。
必须等 loadedmetadata 后再设置
视频元素刚加载完成时，元数据（如时长、宽高）尚未解析，此时修改 playbackRate 会被浏览器静默忽略，且不报错。不能依赖 DOM 加载完成（DOMContentLoaded）或 window.load 事件。
- 推荐监听
loadedmetadata事件：它表示视频基础信息已就绪，是设置倍速最稳妥的时机 - 也可用
canplay，但部分低性能设备可能触发稍晚，loadedmetadata更早更稳定 - 示例写法：
const video = document.querySelector('video');
video.addEventListener('loadedmetadata', () => {
video.playbackRate = 1.25;
});
iOS Safari 需绑定用户手势
iOS 版 Safari 对非 1.0 倍速有严格限制：只有在明确的用户操作（如点击、触摸结束）回调中设置，才会真正生效。自动播放、定时器、异步链式调用均无效。
- 所有倍速按钮必须使用
onclick或addEventListener('click', ...) - 不要在
autoplay触发的play回调里立刻改倍速 - 若需默认启动即倍速，建议先静音 + 暂停，等用户点击“播放”按钮时，再同时调用
play()和设置playbackRate
不能用 setAttribute 设置
setAttribute('playbackrate', '1.5') 或在 HTML 中写 <video playbackrate="1.5"></video> 完全无效。这是因为 playbackRate 是 DOM 元素的 JavaScript 属性（property），不是 HTML 属性（attribute），二者互不关联。
- HTML 中没有
playbackrate这个合法属性，浏览器会静默忽略 - 正确做法永远是操作 JS 属性：
video.playbackRate = 1.5 - 注意大小写：
playbackRate✅，playbackrate❌（静默失败）
设完要读回验证并同步 UI
不同浏览器对倍速的支持范围差异大：Chrome 支持 0.0625–16.0，Safari 桌面版常用 0.25–4.0，而 iOS 只接受有限离散值（如 0.5/1.0/1.5/2.0），设 1.25 可能被自动修正为 1.0 或 1.5。
- 赋值后立即读取
video.playbackRate，比对是否与目标值一致 - 若不一致，说明被降级，可据此更新 UI 或提示用户
- UI 应立刻同步显示（如 “1.5×”），不要依赖
ratechange事件（部分浏览器不触发） - 建议做数值校验：
const safeRate = Math.min(Math.max(parseFloat(rate), 0.25), 4.0)
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
