videojs中遇到的问题

Posted 2020-09-23 Amy-WebFrontEnd

1、The element or ID supplied is not valid. (videojs)：

报错时页面中的代码顺序:js代码在head部分

<video id="example_video_1" class="video-js" 
      controls preload="none" width="400" height="300"
        poster="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1495886342401&di=af1c695a6acede0df16a3740f6dfec0b&imgtype=0&src=http%3A%2F%2Fatt2.citysbs.com%2Fhangzhou%2F2012%2F03%2F13%2F11%2Fmiddle_112501_kiuuladi_0aebaca9151431903ddb8b31fadc53c0.jpg"
        data-setup="{}">
        <source src="rtmp://pb-fms.chinanews.com.cn/vod/81913_wsj.mp4" type=‘rtmp/mp4‘/>
</video>

  <!-- 如果要支持IE8 -->
  <script src="ie8/videojs-ie8.js"></script>
  <!-- 播放器js -->
  <script src="video.js"></script>
  <script>
      videojs.options.flash.swf = "video-js.swf"; 
     var player = videojs(‘example_video_1‘);
     player.ready(function() {
        this.play();
        this.on(‘ended‘, function() {
          videojs.log(‘播放结束了!‘);
        });
     });
  </script>

通过在网上查阅，将js代码放置在页面底部后问题消失

Moving your script tag to the end of your page, or add an onLoad handler so it fires after the page has loaded.

参考：https://github.com/matthojo/videojs-Background/issues/7