没有id的视频标签

video tag without id

本文关键字:标签 的视频 id 没有      更新时间:2023-09-26

我无法解决以下问题:

HTML代码:

<video poster="http://www.html5rocks.com/en/tutorials/video/basics/star.png" controls="">
   <source src="http://www.html5rocks.com/en/tutorials/video/basics/Chrome_ImF.ogv" type="video/ogg; codecs=&quot;theora, vorbis&quot;">
</video>

如果视频标签没有id属性,如何播放或暂停此视频?我尝试使用谷歌chrome开发人员工具,手动添加id属性到视频标签,然后尝试使用javascript播放视频:

var p = document.getElementById('player_id');
p.play();

我用google chrome开发工具修改的HTML是这样的:

    <video id="player_id" poster="http://www.html5rocks.com/en/tutorials/video/basics/star.png" controls="">
...

,但id属性是在页面加载后手动添加的。当我尝试在谷歌chrome控制台执行javascript javascript代码从上面,我得到了这个错误:

**TypeError: Cannot call method 'play' of null**

javascript代码是工作完美的视频标签,其中有id当页面加载。我也试过这个代码,这是不工作id视频标签没有id属性时,页面加载:

var players = document.getElementsByTagName('video'); 
  for(var i=0; i<players.length; i++)players[i].play();

如何访问视频标签控件,如播放,暂停,…如果这个标签没有id?

示例页:http://www.html5rocks.com/en/tutorials/video/basics/

示例页有更多的视频,我也想暂停或只播放一个单独的视频,我也对如何暂停页面上的所有视频感兴趣。

如果页面上只有一个video元素,那么这应该可以工作:

document.getElementsByTagName("video")[0].play();

工作示例

注意:

您必须在DOM准备好之后调用它,以确保当您尝试选择视频元素时它实际上在DOM中。要做到这一点,最简单的方法是将这段代码放在一个脚本标记中,就在body元素的末尾。这样就可以确定video元素在DOM中是可用的。

如果你只有一个视频标签,你可以使用getElementsByTagName('video')避免使用post DOM渲染操作。

其他解决方案,