HTML5オーディオ(音声)

HTML5 のオーディオ機能はすでに非常に強力です。これまで Flash でしか実現できなかった再生、ジャンプ、バッファリングなどの機能も、HTML5 のオーディオで簡単に処理できます。

しかし、これまで、Web ページで音声を再生するための標準はまだありませんでした。

オーディオの構文とプロパティとメソッド

構文を使用する

<audio src="song.mp3"controls="controls"loop="loop" autoplay="autoplay">ブラウザはhtml5</audio>のaudioタグをサポートしていません属性
srcは曲のパスです
controls 再生コントロールタグにcontrols="controls"と書くとWebページに付属の再生コントロールが表示されます
loop ソングループこの属性をタグに追加しますソングループをバックグラウンドから取得する場合は、ajaxでloop=true/falseを設定して制御することもできます。 ;
自動再生曲がロードされると、その後は自動的に再生されますが、それを実現できるのは PC 側だけであり、モバイル側では実現できません (PC 側のブラウザはモバイル側よりもはるかに完成しており、一部の属性はさらに改善されます)
上記はタグ内の属性ですが、もちろん、オーディオを制御するオブジェクト属性としても呼び出すことができます。*

オーディオはラベルであるだけでなく、ウィンドウの下のオブジェクトでもあります。オブジェクトにはプロパティとメソッドがあります。オブジェクトとしてよく使用されるメソッドは何ですか? オブジェクトのプロパティ:

currentTime 現在の再生時間を取得します。

duration 曲を取得します。

play 再生中かどうか true/false を返します。一時停止中かどうか true/false
オブジェクトメソッド:
play() 曲を再生する
pause() 曲を一時停止する
load() 曲をリロードする

HTML5 Medium 3 基本形式:

2. 非互換性リマインダーコード付き

お使いのブラウザは audio タグをサポートしていません。

</audio>

3. ブラウザの書き込みメソッドと互換性があるようにしてください

<audiocontrols="controls">

お使いのブラウザは audio タグをサポートしていません。 </オーディオ>

りー

次のセクション

新しいファイル

<!Doctype html>
<html>
<head>
<title>HTML5多媒体</title>
<meta charset="utf-8"/>
<script> 
function onInputFileChange() { 
var file = document.getElementById('file').files[0]; 
var url = URL.createObjectURL(file); 
console.log(url); 
document.getElementById("audio_id").src = url; 
} 
</script> 
</head>
<body> 
<input type="file" id="file" onchange="onInputFileChange()"> 
<audio id="audio_id" controls autoplay loop>Your browser can't support HTML5 Audio</audio> 
</body> 
</html>

提出するリセットコード

自動運転

全画面表示