html使用plyr播放器播放音视频

对于视频


<video poster="/path/to/poster.jpg" controls>
  <source src="/path/to/video.mp4" type="video/mp4">
</video>

播放音频

<audio controls>
  <source src="/path/to/audio.mp3" type="audio/mp3">
  <source src="/path/to/audio.ogg" type="audio/ogg">
</audio>

在body标签结束之前要调用初始化函数

<script src="path/to/plyr.js"></script>
<script>plyr.setup();</script>

如果想使用js决定载入视频

        <!-- 载入plyr的css文件-->
        <link rel="stylesheet" href="path/to/plyr.css">
        <!-- 载入plyr-->
    <script src="path/to/plyr.js"></script>

<body>

    <!--data-plyr='{ volume: 2 }' 为元素指定plyr的属性，设置默认音量 -->
    <video data-plyr='{ volume: 2 }'>
        <!--设置资源id -->
        <source id="videosource">
    </video>
    <script>
        <!--查找资源id-->
                const videosource = document.getElementById('videosource');
        <!--设置资源内容-->
                videosource.src = "./ss.mp4";
        </script>
        <!--初始化-->
    <script>plyr.setup();</script>
</body>