关于前端:海康h5player添加视频加载中及加载失败图片

海康视频没有自带的loading及加载失败成果，上面咱们在视频加载胜利之前增加loading成果，在视频加载失败之后增加视频加载失败图片
在海康自带的办法视频预览realplay办法中增加：

// 视频预览 === 海康realplay (playURL, index1) {    // 视频增加加载中图片    const id = "player-container-" + index1    var d1 = document.getElementById(id) //获取div元素    d1.childNodes.forEach(item => {        if (item.nodeName == '' || item.nodeName == 'IMG') {            d1.removeChild(item)        }    })    var im = document.createElement("img") //创立图片    im.src = './image/loadingBlue.png'    //图片设置成和div一样大小    const divHeightNum = d1.style.height.slice(0, d1.style.height.length - 2)    const imgHeightNum = divHeightNum * 0.8    im.style.width = imgHeightNum + 'px'    im.style.height = imgHeightNum + 'px'    im.style.position = "absolute"    im.style.top = '50%'    im.style.left = '50%'    const positionNum = (imgHeightNum / 2) - imgHeightNum    im.style.marginLeft = positionNum + 'px'    im.style.marginTop = positionNum + 'px'    d1.appendChild(im)    //图片挂载到div上                        this.mode = 0  //解码形式：0一般模式 1高级模式 插件更新后用一般模式能够自解硬码，性能更好    const { player, mode, urls } = this,                            index = player.currentWindowIndex    // playURL = this.realplay                            player.JS_Play(playURL, { playURL, mode }, index1).then(() => {        // 视频加载胜利删除加载中img        d1.removeChild(d1.childNodes[7])        console.log('realplay success')    },    e => {         // 视频加载失败图片批改为加载失败img        im.src = './image/loadingFailBlue.png'        console.error(e)    })}

如果增加了视频宫格切换须要在点击切换时增加代码删除上次宫格中可能展现进去的加载失败图片：

// 切换分屏删除之前分屏加载中及加载失败图片const splitScreenList = ['player-container-0', 'player-container-1', 'player-container-2', 'player-container-3','player-container-4', 'player-container-5', 'player-container-6', 'player-container-7', 'player-container-8']splitScreenList.forEach((item, index) => {    document.getElementById(item).childNodes.forEach(item1 => {        if (item1.nodeName == null || item1.nodeName == 'IMG') {            document.getElementById(item).removeChild(item1)        }    })})