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>

ビデオ タグに id 属性がない場合、このビデオを再生または一時停止するにはどうすればよいですか? Google 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 属性が手動で追加されました。上記の JavaScript コードを Google Chrome コンソールで実行しようとすると、次のエラーが発生しました。

**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/

サンプルページにはより多くのビデオがあり、別のビデオのみを一時停止または再生したいのですが、ページ上のすべてのビデオを一時停止する方法にも興味があります。

4

2 に答える 2

1

ページに単一のビデオ要素しかない場合、これは機能するはずです:

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

実施例

知らせ：

ビデオ要素を選択しようとしたときに、実際にビデオ要素が DOM にあることを確認するために、DOM の準備ができた後に呼び出す必要があります。これを行う最も簡単な方法は、このコードをスクリプト タグ内の body 要素のちょうど最後に配置することです。そうすれば、video-element が DOM で利用可能であることを確実に知ることができます。

于 2013-03-07T09:48:43.837 に答える
0

ビデオタグが1つしかない場合は、getElementsByTagName('video')DOM後のレンダリング操作を使用しないようにすることができます。

他の解決策は、IDを入力したときにdomの後に全体をレンダリングすることです。

于 2013-03-07T09:51:23.617 に答える