此时此刻,我感到非常沮丧。 我想通过 javascript 控制视频:
- 将音量设为 20%
- 点击视频即可播放和暂停
因为我有这个 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';
}
});
但 Chrome 控制台仅显示:Uncaught TypeError: Cannot set property 'volume' of null
这是为什么?
提前致谢!
最佳答案
您应该将 script 标签移到 body 标签的末尾,目前脚本加载时您的 DOM 尚未设置,因此它无法从 DOM 访问元素。
关于javascript - 未捕获的类型错误 : Cannot set property 'volume' of null,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48629562/