为啥变量放在方法外就调用不了了

<!DOCUMENT>

<head>
    <script type="text/javascript">
        var vi = document.getElementById("video1");
        var vi = document.getElementById("video1");

        function pl() {
            vi.play();
        }

        function pa() {
            vi.pause();
        }
    </script>
</head>
<html>

<body>
    <video src="http://www.w3school.com.cn/example/html5/mov_bbb.mp4" controls="controls" id="video1">
    </video>
    <button id="play" onclick="pl()">播放</button>
    <button id="play" onclick="pa()">暂停</button>
</body>

</html>

html标签需要通过浏览器解析才能成为DOM节点

你在标签没有被解析之前就进行了DOM操作，当然是不行的。

你需要在DOMReady之后再使用dom操作, 通过把script标签放在body最底部或者通过事件监听的方式等待dom就绪的情况下再操作它。

因为你还没有在 DOM 初始化之后就执行 document.getElementById() 可以把上述代码放在 window.onload = function() {}; 之中

基本问题上边都讲过了，再补充一点。

script标签要放在body结束标签前，就是为了预防dom还没加载完就去获取dom对象的行为

【热门文章】