Zusammenfassung der Wiedergabeelemente für Audio- und Videomedien in HTML5_HTML5-Tutorial-Tipps

Audio- und Video-Encoder/Decoder ist eine Reihe von Algorithmen, die zum Kodieren und Dekodieren eines bestimmten Audio- oder Videostreams verwendet werden, damit Audio und Video abgespielt werden können. Rohe Mediendateien sind sehr groß, und wenn sie nicht kodiert sind, können die Daten, aus denen ein Video- und Audioclip besteht, so groß sein, dass die Verbreitung über das Internet unerträglich lange dauert. Ohne einen Decoder kann der Receiver die codierten Daten nicht wieder in die ursprünglichen Mediendaten zusammensetzen. Codecs können ein bestimmtes Containerformat lesen und die darin enthaltenen Audio- und Videospuren dekodieren.
Medienelemente verstehen
1. Grundoperation: Medienelemente deklarieren

XML/HTML-CodeInhalt in die Zwischenablage kopieren

1. <Audio steuert src="Adele-Set Fire To The Rain.mp3">
2. Der von Ihnen verwendete Browser unterstützt kein HTML5-Audio
3. Audio>

Das Controls-Attribut im Code weist den Browser an, allgemeine Benutzersteuerelemente anzuzeigen, einschließlich Start, Stopp, Überspringen und Lautstärkeregelung. Wenn das Steuerattribut nicht angegeben ist, kann der Benutzer das Audio auf der Seite nicht abspielen.
2. Verwenden Sie das Quellelement
Im einfachsten Fall kann das src-Attribut direkt auf die Mediendatei verweisen. Was ist jedoch, wenn der Browser den entsprechenden Container oder Encoder nicht unterstützt? Dies erfordert die Verwendung von Backup-Deklarationen. In die Fallback-Anweisung können mehrere Quellen einbezogen werden, und der Browser kann aus so vielen Quellen auswählen:

XML/HTML-CodeInhalt in die Zwischenablage kopieren

1. <Audio Steuerelemente>
2. <Quelle src="Adele- Set Fire To The Rain.mp3" >
3. <Quelle src="Adele- Set Fire To The Rain.ogg" >
4. Audio>

Bei Quellen beurteilt der Browser nach der Reihenfolge der Deklaration. Wenn mehr als eine unterstützt wird, wählt der Browser die erste unterstützte Quelle.
3. Mediensteuerung
Durch das Setzen des Attributs Autoplay im Audioelement oder Videoelement wird die Audio- oder Videodatei nach dem Laden automatisch abgespielt, ohne dass eine Benutzerinteraktion erforderlich ist.
Häufig verwendete Steuerfunktionen

函数	动作
load()	加载音频/视频文件，为播放做准备，通常情况下不必调用，除非是动态生成的元素。用来在播放前预加载。
play()	加载（有必要的话）并播放音频/视频文件。除非音频/视频已经暂停在其他位置了，否则默认从头开始播放
pause()	暂停处于播放状态的音频/视频文件
canPlayType(type)	测试video元素是否支持给定MIME类型的文件

Schreibgeschützte Medieneigenschaften

只读特性	值
duration	整个媒体文件的播放时长，以s为单位。如果无法获取时长，则返回NaN。
paused	如果媒体文件当前被暂停，则返回true。如果还未开始播放，则返回false。
ended	如果媒体文件已经播放完毕，则返回true
startTime	返回最早的播放起始时间，一般是0.0，除非是缓冲过的媒体文件，并且一部分内容已经不在缓冲区
error	在发生了错误的情况下返回的错误代码
currentSrc	以字符串形式返回当前正在播放或已加载的文件。对应于浏览器在source元素中选择的文件。

Skriptfähige Eigenschaftswerte

特性	值
autoplay	将媒体文件设置为创建后自动播放，或者查询是否已设置为autoplay
loop	如果媒体文件播放完毕后能重新播放则返回true，或者将媒体文件设置为循环播放（或者不循环播放）
currentTime	以s为单位返回从开始播放到现在所用的时间。在播放过程中，设置currentTime来进行搜索，并定位到媒体文件的特定位置
controls	显示或隐藏用户控制界面，或者查询用户控制界面当前是否可见
volume	在0.0到1.0之间设置音频音量的相对值，或者查询当前音量的相对值。
muted	为音频文件设置静音或者消除静音，或者渐层当前是否为静音
autobuffer	通知播放器在媒体文件开始播放前，是否进行缓冲加载。如果媒体文件已经设置为autoplay，则忽略测特性。

3.1 Verwendung von Audio- und Videoelementen
Das HTML5-Videoelement ist dem Audioelement sehr ähnlich, verfügt jedoch über einige mehr Funktionen als das Audioelement.

特性	值
poster	在视频加载完成之前，代表视频内容的图片的URL地址，可以想象一下“电影海报”。该特性不仅可读，而且可以修改，以便更换图片
width、height	读取或设置显示尺寸。如果设置的宽度与视频本身大小不匹配，可能导致居中显示，上下或左右可能出现黑色条状区域。
videoWidth、videoHeight	返回视频固有的或自适应的宽度和高度。只读video元素还有一个audio元素不支持的关键特性：可被HTML5 Canvas的函数调用。

Tipp: Wenn Canvas Video als Zeichenquelle verwendet, wird nur der aktuell wiedergegebene Frame gezeichnet.