Question

此刻我非常沮丧。我想通过javascript控制视频：

将音量设置为20％
play＆amp;点击视频暂停

因为我有这个html（还包括一个小PHP）

<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="player.js" type="text/javascript"></script>
</head>
<body>
<?php
        if(isset($_GET["id"])) {
                $video = $_GET["id"];
        }else{
                $video = "test.mp4";
        }
?>

<video id="video" preload="auto" autoplay="true"  loop="loop">
     <?php echo "<source src=\"$video\" type=\"video/mp4\">"; ?>
     <source src="movie.webm" type="video/webm">
          Sorry, your browser does not support HTML5 video.
</video>
</body>

player.js：

var vid = document.getElementById('video');

vid.volume = 0.2;

vid.addEventListener('click', function () {
        if (vid.paused == false) {
            vid.pause();
            vid.firstChild.nodeValue = 'Play';
        } else {
            vid.play();
            vid.firstChild.nodeValue = 'Pause';
        }
});

但是Chromes控制台刚刚显示：Uncaught TypeError: Cannot set property 'volume' of null 这是为什么？提前谢谢！

Answer 1

您应该在body标记的末尾移动脚本标记，目前在脚本加载时尚未设置DOM，因此无法访问DOM中的元素。

未捕获的TypeError：无法将属性'volume'设置为null

1 个答案: