javascript 解决ie下“视频类型不受支持或文件路径无效”

在做动态切换下一个视频的时候，IE遇到了一个问题。解决记录并分享~

查看video兼容性
首先我是用<video>标签做的视频播放，ie是支持到9+。
如果想支持ie6+可以使用videojs→videojs中文文档详解

一、报错信息

1. 错误：视频类型不受支持或文件路径无效（video标签报错）
2. MEDIA12899: 音频/视频: 未知 MIME 类型。（控制台报错）
   

二、问题定位

以下是我的代码，在其他主流浏览器上没问题。

// 错误方法一
<video :src="mediaUrl" controls="controls"></video>
// 错误方法二
document.getElementById('videoLabel').src = “mediaUrlUrl.mp4”

共同点是通过改变src来切换下一个视频。

三、解决方案

<div id="videoPlayerBox"></div>
<script>
// 如果video标签存在，则删除上一个video标签
if(document.getElementById('videoLabel')) {
	document.getElementById('videoPlayerBox').removeChild(document.getElementById('videoLabel'));
}
// 生成并写入新标签
document.getElementById('videoPlayerBox').innerHTML = '<video id="videoLabel" src="'+mediaUrl+'" controls="controls" style="width:100%"></video>';
</script>