Video.js一款优秀的开源的HTML5视频播放器
Video.js - 网络视频播放器和框架
更新 Video.js 10 将于 2026 年初迎来重大更新！
Video.js 是一款功能齐全的开源视频播放器，适用于所有基于 Web 的平台。
Video.js 开箱即用，支持所有常见的 Web 媒体格式，包括 HLS 和 DASH 等流媒体格式。它适用于桌面设备、移动设备、平板电脑以及基于 Web 的智能电视。它可以通过强大的插件生态系统进行进一步扩展和定制。
Video.js 于 2010 年 5 月启动，自那时起：
- 数百万网站已使用 VideoJS（来源 [Builtwith][builtwith]）
- 每月仅 CDN 托管版本就拥有数十亿终端用户（来源 Fastly 统计数据）
- 900 多位杰出贡献者为 video.js 核心做出贡献
- 数百个 插件
功能特点
- 播放任何内容： 不仅支持 MP4 和 WebM 等“传统”文件格式，还支持 HLS 和 DASH 等自适应流媒体格式。甚至还配备了专门的直播 UI！
- 易于适配： Video.js 旨在提供可靠且一致的基础构建。播放器开箱即用，外观精美，只需添加少量 CSS 即可轻松设置样式。
- 数百个插件： 当您需要添加其他功能时，完善的插件架构将为您提供支持。社区已经构建了数百个可供安装的皮肤和插件，例如 Chromecast、IMA，甚至 VR。
- 全面支持： 您的视频应该在您的应用上运行的任何地方都能正常播放。我们的团队致力于支持所有现代浏览器，包括桌面浏览器和移动设备。
快速入门
感谢 [Fastly][fastly] 的各位好心人，我们推出了一个免费的、CDN 托管的 Video.js 版本，任何人都可以使用。请在文档的 <head> 中添加以下标签：
<link href="//vjs.zencdn.net/8.23.4/video-js.min.css" rel="stylesheet">
<script src="//vjs.zencdn.net/8.23.4/video.min.js"></script>或者，您可以通过从 npm 获取、从 GitHub releases 下载或通过 unpkg 或其他 JavaScript CDN（如 CDNjs）包含 Video.js。
<!-- unpkg : use the latest version of Video.js -->
<link href="https://unpkg.com/video.js/dist/video-js.min.css" rel="stylesheet">
<script src="https://unpkg.com/video.js/dist/video.min.js"></script>
<!-- unpkg : use a specific version of Video.js (change the version numbers as necessary) -->
<link href="https://unpkg.com/video.js@8.23.4/dist/video-js.min.css" rel="stylesheet">
<script src="https://unpkg.com/video.js@8.23.4/dist/video.min.js"></script>
<!-- cdnjs : use a specific version of Video.js (change the version numbers as necessary) -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.23.4/video-js.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.23.4/video.min.js"></script>接下来，使用 Video.js 非常简单，只需创建一个 <video> 元素，并添加一个 data-setup 属性即可。此属性至少必须具有 '{}' 的值，但它可以包含任何 Video.js [options][options] - 只需确保它包含有效的 JSON 即可！
<video
id="my-player"
class="video-js"
controls
preload="auto"
poster="//vjs.zencdn.net/v/oceans.png"
data-setup='{}'>
<source src="//vjs.zencdn.net/v/oceans.mp4" type="video/mp4"></source>
<source src="//vjs.zencdn.net/v/oceans.webm" type="video/webm"></source>
<source src="//vjs.zencdn.net/v/oceans.ogv" type="video/ogg"></source>
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a
web browser that
<a href="https://videojs.com/html5-video-support/" target="_blank">
supports HTML5 video
</a>
</p>
</video>页面加载时，Video.js 会找到此元素并自动在其位置设置播放器。
如果您不想使用自动设置，可以省略 data-setup 属性，并使用 videojs 函数手动初始化 <video> 元素：
var player = videojs('my-player');videojs 函数还接受一个 options 对象和一个在播放器准备就绪时调用的回调：
var options = {};
var player = videojs('my-player', options, function onPlayerReady() {
videojs.log('Your player is ready!');
// In this context, `this` is the player that was created by Video.js.
this.play();
// How about an event listener?
this.on('ended', function() {
videojs.log('Awww...over so soon?!');
});
});如果您已准备好深入了解，[入门][getting-started] 页面和 [文档][docs] 是获取更多信息的最佳去处。如果您遇到困难，请访问我们的 [Slack][slack-link]！
贡献
Video.js 是一个免费的开源库，我们感谢您提供的任何帮助——无论是修复错误、改进文档还是建议新功能。查看 [贡献指南][贡献] 了解更多信息！
Video.js 使用 [BrowserStack][browserstack] 进行兼容性测试。
行为准则
请注意，本项目发布时附带 [贡献者行为准则][coc]。参与本项目即表示您同意遵守其条款。
许可证
Video.js 遵循 Apache 许可证 2.0 版 [licensed][license]。
Video.js 是 [Brightcove, Inc][bc] 的注册商标。