JS无法获取video标签

Question

html网页中源码有video标签，但是控制台JS获取不到，除非每次点击视频后才能获取这个元素，有什么办法不用点击就能获取video标签吗

Answer 1

再看亿遍你的名字 上午好☀️☀️☀️️
本答案参考ChatGPT-3.5

在JavaScript中，我们可以使用document.querySelector()方法来获取HTML页面中的元素，包括video标签。但是，如果你无法直接通过document.querySelector('video')来获取video元素，可能是因为该元素在页面加载时还没有被正确加载，或者该元素是通过异步加载的方式添加的。以下是一些可能的解决方案：

1. 使用DOMContentLoaded事件：可以在DOMContentLoaded事件中获取video元素，该事件会在HTML文档加载完成并且DOM结构已经可以操作时触发。在事件处理函数中，你可以使用document.querySelector('video')来获取video元素。示例代码如下：

document.addEventListener('DOMContentLoaded', function() {
  var video = document.querySelector('video');
  // 处理video元素
});

1. 使用window.onload事件：window.onload事件在整个页面（包括资源文件）加载完成后触发。你可以在window.onload事件中尝试获取video元素。示例代码如下：

window.onload = function() {
  var video = document.querySelector('video');
  // 处理video元素
};

注意： 上述两种解决方案中，video元素必须存在于HTML文档中。

1. 使用延时加载：你可以使用setTimeout函数来延迟一定的时间后再尝试获取video元素，以确保元素已经正确加载到页面上。示例代码如下：

setTimeout(function() {
  var video = document.querySelector('video');
  // 处理video元素
}, 1000); // 延时1秒钟

**注意：**延时时间可以根据实际情况进行调整。

1. 监听其他事件：如果你知道video元素是在某个特定事件发生后被添加到页面上的，你可以尝试在该事件触发时获取video元素。例如，如果video元素是在页面滚动到某个位置后才加载的，你可以监听滚动事件，并在事件处理函数中获取video元素。

修改后的代码： 您可以尝试以下方法在页面加载时获取video元素。

document.addEventListener('DOMContentLoaded', function() {
  var video = document.querySelector('video');
  // 处理video元素
});

或者你可以使用window.onload事件：

window.onload = function() {
  var video = document.querySelector('video');
  // 处理video元素
};

请确保video元素存在于HTML文档中，并且在获取元素之前已经正确加载到页面上。