HTML5 での audio タグと video タグの使用

この記事は主に HTML5 での audio タグと video タグの使用方法を紹介しています。これは、必要な友達と共有できるようになりました。

最近作成した WeChat 共有ページには多くの声が寄せられています。ビデオでは、関連するメソッド属性の多くがこれまで触れられていないことが示されているため、今すぐ記録してください。

1. まず、2 つのタグに関する基本情報を理解します:

2 つのタグの基本属性:

両方のタグのイベント:

2. プロジェクトでの使用: ビデオが読み込まれていない場合、ここでの画像の最初のフレームはバックグラウンドから送信されることがわかります。 video タグには、poster 属性があります。これは、ビデオの最初のフレームを表示するために特別に使用され、ビデオのカバー画像に相当します。ポスター属性は、ビデオのポスター属性値を設定または返すために使用されます。この属性は、ビデオのロード時、またはユーザーが再生ボタンをクリックする前に表示される画像を記述します。この属性が含まれていない場合は、ビデオの最初のフレームが代わりに使用されます。

<p class="newsInfo" v-for=" item in newsFragment">
<p class="text">{{item.fragment_text_describe}}</p>
<p v-if="item.fragmentFile" v-for="items in item.fragmentFile">
<img v-if="items.fragment_type==1" :src="items.fragment_url" alt="">
<video v-else :poster="items.fileCover" controls :src="items.fragment_url"></video>
</p>
</p>

オーディオを再生する場合、ブラウザはこのタイプのオーディオをサポートしていない可能性があるため、判断する必要があります。canPlayType() メソッドを使用して、ブラウザが指定されたオーディオ/ビデオ タイプを再生できるかどうかを確認してください。 canPlayType() メソッドは、次のいずれかの値を返すことができます:
"おそらく" - ブラウザーはこのオーディオ/ビデオ タイプをサポートする可能性が最も高いです
"maybe" - ブラウザーはこのオーディオ/ビデオ タイプをサポートする可能性があります

"" - (空の文字列) ブラウザーはこのオーディオ/ビデオ タイプをサポートしていません

使用構文:

audio.canPlayType("mp3"))

関連推奨事項:

HTML5 の sessionStorage オブジェクトについての深い理解

HTML5 ビデオ タグ操作の詳細なビデオ説明

以上がHTML5 での audio タグと video タグの使用の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。