1

我无法解决以下问题：

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>

如果 video 标签没有 id 属性，如何播放或暂停此视频？我尝试使用谷歌浏览器开发工具并手动将 id 属性添加到视频标签，然后尝试使用 javascript 播放视频：

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

我用谷歌浏览器开发工具更改的 HTML 就像：

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

但是 id 属性是在页面加载后手动添加的。当我尝试在 google chrome 控制台中执行上面的 javascript 代码时，我收到了这个错误：

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

javascript 代码在页面加载时具有 id 的视频标签上运行良好。我也尝试过这段代码，它不起作用 id video 标签在页面加载时没有 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/

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

4

2 回答 2

1

如果页面上只有一个视频元素，那么这应该可以：

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

工作示例

注意：

您必须在 DOM 准备好后调用它，以确保当您尝试选择它时视频元素实际上在 DOM 中。最简单的方法是把这段代码放在一个脚本标签中，就在你的正文元素的末尾。这样您就可以确定视频元素在 DOM 中可用。

于 2013-03-07T09:48:43.837 回答
0

如果您只有一个视频标签，则可以使用getElementsByTagName('video')避免使用后 DOM 渲染操作。

其他解决方案，在放置 id 时在 dom 之后渲染整体。

于 2013-03-07T09:51:23.617 回答