极客笔记如何使用JavaScript设置Video.js
在这个教程中，我们将学习如何使用JavaScript设置video.js。我们还将查看一些示例，以便更好地理解。
首先，Video.js是一个非常受欢迎且易于使用的现代网络视频播放器，它基于HTML5构建，并为网络视频播放器提供更好的功能和功能。它支持各种视频播放格式-既有标准的HTML5格式，也有像Youtube、Vimeo和Flash这样的现代格式。除此之外，它还适用于几乎所有的显示尺寸，如桌面、移动设备等。
现在，让我们看看如何使用JavaScript在项目中设置Video.js。
安装Video.js
Video.js在官方上可通过CDN和 npm（node包管理器） 来使用。我们将逐个查看每种方法。
通过CDN安装
将Video.js包含在本地项目中最便捷的方法是使用免费的CDN URL。
使用以下CDN URL来包含Video.js：
<link href="https://vjs.zencdn.net/7.19.2/video-js.css" rel="stylesheet" />
上面的代码通过
通过NPM安装
要使用node包管理器在项目中安装video.js，请在项目目录中使用下面提到的命令：
npm install --save-dev video.js
这个命令将安装最新版本的video.js，并将其作为一个依赖项保存在”package.json”中。
现在，我们已经学习了两种安装视频的方法，让我们在本文的下一部分学习如何使用video.js。
创建一个播放器
Video.js的一个关键优势是它装饰了一个传统的<video>元素，同时增强了其API和方法。
Video.js支持标准的<video>元素标签及其所有的属性，如controls、autoplay等，并且还提供一些独特的video-js专有选项。
现在，我们将使用<video>标签和<video-js>标签来创建一个播放mp4视频文件的播放器。
示例
考虑下面展示的HTML代码。
<!DOCTYPE html>
<html>
<head>
<link href="https://vjs.zencdn.net/7.19.2/video-js.css"rel="stylesheet" />
</head>
<body>
<video id="my-video" class="video-js" controls preload="auto"width="640" height="264" data-setup='{}'>
<source src="https://www.tutorialspoint.com/videos/sample1080p.mp4" type="video/mp4" />
</video>
<script
src="https://vjs.zencdn.net/7.19.2/video.min.js"></script>
</body>
</html>