通过JavaScript操作video元素的play()和pause()方法可控制视频播放与暂停，需先用document.getElementById获取元素，结合按钮点击事件切换状态并更新按钮文本，注意浏览器可能阻止无用户交互的自动播放。
JavaScript 可以轻松控制 HTML5 视频的播放、暂停等行为，主要通过操作 元素提供的方法来实现。最常用的就是 play() 和 pause() 方法。
获取视频元素
要控制视频，先要在 JavaScript 中获取到页面中的 video 元素。可以通过 ID、类名或其他选择器方式获取，通常使用 document.getElementById 最为直接。
例如：
const video = document.getElementById('myVideo');
使用 play() 播放视频
调用 play() 方法可以让视频开始播放。这个方法返回一个 Promise，可以用来处理自动播放被浏览器阻止的情况。
示例代码：video.play(); // 开始播放 如果浏览器阻止自动播放（如无用户交互），Promise 会返回拒绝状态，可做提示处理更安全的写法：
video.play().then(() => { console.log('播放成功');}).catch(error => { console.log('播放失败：', error);});
使用 pause() 暂停视频
调用 pause() 方法会暂停当前正在播放的视频。这个方法没有返回值，也不需要参数。
立即学习“Java免费学习笔记（深入）”；
示例代码：
video.pause(); // 暂停播放
结合按钮控制播放/暂停
实际开发中，常通过按钮点击切换播放和暂停状态。
HTML 示例：
JavaScript 控制逻辑：
const video = document.getElementById('myVideo');const button = document.getElementById('toggleBtn');button.addEventListener('click', () => { if (video.paused) { video.play(); button.textContent = '暂停'; } else { video.pause(); button.textContent = '播放'; }});
基本上就这些。通过监听视频状态（如 paused 属性），再调用 play 或 pause 方法，就能实现基本控制。注意部分浏览器对自动播放有限制，建议在用户操作后触发播放行为。
以上就是如何用JavaScript控制HTML视频播放_JS控制HTML视频play“pause方法的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1586009.html
微信扫一扫 
支付宝扫一扫 
