通过javascript的HTML5视频高度和宽度

我试图用一个简单的javascript从视频中获取并打印宽度和高度属性，但由于某些原因，我无法管理

这是javascript

video = document.getElementsByTagName("video")[1];
span1 = document.getElementById("dimensions");
span1.innerHTML = video.videoWidth + " x " + video.videoHeight;

这是它影响的html5代码（这是html结构中的第二个视频标记）

尺寸：

---

非常感谢，我是一个初学者，所以请不要太在意我。

基于标记的索引不会返回您想要的元素。索引是基于零的，因为节点列表类似于数组，并且从0开始索引

var video = document.getElementsByTagName("video")[0];

编辑：抱歉，没有看到您说这是第二个视频标签。在这种情况下，我不确定，因为它对我有效：

您可能希望尝试的一件事是，将用于获取处理程序内部宽度和高度的代码放在侦听loadedmetadata事件的视频标记上：

video.addEventListener("loadedmetadata", dimensionFunction, false);

其中，dimensionFunction是一个函数，它执行您已经在执行的操作来获取维度

---

这样做的目的是确保视频的元数据在您尝试抓取之前已经下载。

视频是webm格式的，并且仅在Chrome中播放，因为现在我添加了一个侦听器，也尝试了1秒延迟，它仅在Chrome中运行良好，可能是因为其他浏览器还不支持webm？它在Firefox中显示0 x 0，并带有时间延迟，而在listener中则没有显示任何内容。但是，嘿，在Chrome:D中一切都很好thanks@3mpetri在这种情况下，您应该将脚本移到html代码下面。或者在

onload

事件中执行脚本。我强烈建议不要使用延迟。同意将其放在onload事件中。要让它在其他浏览器上播放，只需将其编码为mp4和ogv，您就可以涵盖所有支持html5的浏览器。使用各种免费工具进行编码非常简单-我使用Miro Converter：

video.addEventListener("loadedmetadata", dimensionFunction, false);