未捕获的TypeError：无法读取null javascript的属性'appendChild'

Question

我一直在尝试使用video标签从本地文件夹播放视频。设置为元素作为源的视频文件的路径正确，并且可以使用“ localhost / filepath ..”在浏览器中播放。仍然appendChild表示其为空

function PlayWordFile(fileNam)
        {
            debugger

            if (fileNam=="")
            {
                alert('No file attached.');
                return;
            }
            var extn = fileNam.split('.').pop();             
            if (extn == "mp4") {              
                var y=fileNam;
                var video=document.getElementById('VideoPlayer');
                var source=document.createElement('source');
                source.setAttribute('src',"/x/"+y);
                video.appendChild(source);

                alert(source)

                video.play();
            }
        }

HTML代码：

<div id="PanelMainPlayer" runat="server">
     <video id="videoPlayer" width="250" height="200" controls autoplay></video>
</div>

有人可以在这里发现我做错了什么吗？

Answer 1

错别字。 HTML中有videoPlayer，而JS中有VideoPlayer。