{"id":7201,"date":"2025-06-08T13:28:17","date_gmt":"2025-06-08T10:28:17","guid":{"rendered":"https:\/\/1.cbm.ua\/?p=7201"},"modified":"2026-01-13T20:39:24","modified_gmt":"2026-01-13T17:39:24","slug":"javascript-audio-play","status":"publish","type":"post","link":"https:\/\/1.cbm.ua\/?p=7201","title":{"rendered":"javascript audio play"},"content":{"rendered":"\n

https:\/\/www.w3schools.com\/jsref\/dom_obj_audio.asp<\/a><\/p>\n\n\n\n

HTML DOM Audio Object<\/h1>\n\n\n\n
\n\n\n\n

Audio Object<\/h2>\n\n\n\n

<\/p>\n\n\n\n

The Audio object represents an HTML <audio> element.
Access an Audio Object
You can access an <audio> element by using getElementById():<\/td>		Audio Object \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 HTML
\u0414\u043e\u0441\u0442\u0443\u043f \u043a Audio Object
\u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443
<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
var x = document.getElementById(\"myAudio\");<\/pre>\n\n\n\n
Create an Audio Object
You can create an <audio> element by using the document.createElement() method:<\/td>		\u0421\u043e\u0437\u0434\u0430\u0442\u044c \u0430\u0443\u0434\u0438\u043e \u043e\u0431\u044a\u0435\u043a\u0442
\u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u044d\u043b\u0435\u043c\u0435\u043d\u0442 
<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
Audio Object Properties — \u0421\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0430\u0443\u0434\u0438\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430<\/p>\n\n\n\n
var x = document.getElementById(\"myAudio\");<\/pre>\n\n\n\n
<\/p>\n\n\n\n
Audio Object Properties<\/h2>\n\n\n\n
Property<\/th>Description<\/th><\/td><\/tr>
audioTracks<\/a> — \u041d\u0415 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f.<\/td>Returns an AudioTrackList object representing available audio tracks
<\/td>		\u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 AudioTrackList, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u0430\u0443\u0434\u0438\u043e\u0434\u043e\u0440\u043e\u0436\u043a\u0438.<\/td><\/tr>
autoplay<\/a><\/td>Sets or returns whether the audio should start playing as soon as it is ready
<\/td>		\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442, \u0434\u043e\u043b\u0436\u043d\u043e \u043b\u0438 \u0430\u0443\u0434\u0438\u043e \u043d\u0430\u0447\u0438\u043d\u0430\u0442\u044c \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u0441\u043b\u0435 \u0433\u043e\u0442\u043e\u0432\u043d\u043e\u0441\u0442\u0438<\/td><\/tr>
buffered<\/a><\/td>Returns a TimeRanges object representing the buffered parts of an audio<\/td>\u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 TimeRanges, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u0431\u0443\u0444\u0435\u0440\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0447\u0430\u0441\u0442\u0438 \u0430\u0443\u0434\u0438\u043e<\/td><\/tr>
controller<\/a><\/td>Returns the MediaController object representing the current media controller of an audio<\/td>\u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 MediaController, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u0442\u0435\u043a\u0443\u0449\u0438\u0439 \u043c\u0435\u0434\u0438\u0430-\u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 \u0430\u0443\u0434\u0438\u043e.<\/td><\/tr>
controls<\/a><\/td>Sets or returns whether an audio should have controls displayed (play\/pause etc)
<\/td>		\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442, \u0434\u043e\u043b\u0436\u043d\u044b \u043b\u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c\u0441\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0430\u0443\u0434\u0438\u043e (\u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435\/\u043f\u0430\u0443\u0437\u0430 \u0438 \u0442. \u0434.)<\/td><\/tr>
crossOrigin<\/td>Sets or returns the CORS settings of an audio<\/td>\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 CORS \u0430\u0443\u0434\u0438\u043e<\/td><\/tr>
currentSrc<\/a><\/td>Returns the URL of the current audio<\/td>\u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 URL \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0430\u0443\u0434\u0438\u043e
<\/td><\/tr>
currentTime<\/a><\/td>Sets or returns the current playback position in an audio (in seconds)

<\/td>		\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0442\u0435\u043a\u0443\u0449\u0443\u044e \u043f\u043e\u0437\u0438\u0446\u0438\u044e \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0432 \u0430\u0443\u0434\u0438\u043e (\u0432 \u0441\u0435\u043a\u0443\u043d\u0434\u0430\u0445)<\/td><\/tr>
defaultMuted<\/a><\/td>Sets or returns whether the audio should be muted by default
<\/td>		\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u043b\u0438 \u043e\u0442\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0437\u0432\u0443\u043a \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e.<\/td><\/tr>
defaultPlaybackRate<\/a><\/td>Sets or returns whether the default playback speed of the audio
<\/td>		\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0437\u0432\u0443\u043a\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e.<\/td><\/tr>
duration<\/a><\/td>Returns the length of an audio(in seconds)<\/td>\u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0434\u043b\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0430\u0443\u0434\u0438\u043e (\u0432 \u0441\u0435\u043a\u0443\u043d\u0434\u0430\u0445)<\/td><\/tr>
ended<\/a><\/td>Returns whether the playback of the audio has ended<\/td>Returns whether the playback of the audio has ended<\/td><\/tr>
error<\/a><\/td>Returns a MediaError object representing the error state of the audio<\/td>\u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 MediaError, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 \u0430\u0443\u0434\u0438\u043e.<\/td><\/tr>
loop<\/a><\/td>Sets or returns whether the audio should start playing over again, every time it is finished
<\/td>		\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442, \u0434\u043e\u043b\u0436\u043d\u043e \u043b\u0438 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0437\u0432\u0443\u043a\u0430 \u043d\u0430\u0447\u0438\u043d\u0430\u0442\u044c\u0441\u044f \u0437\u0430\u043d\u043e\u0432\u043e \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u043f\u043e\u0441\u043b\u0435 \u0435\u0433\u043e \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u044f<\/td><\/tr>
mediaGroup<\/a><\/td>Sets or returns the name of the media group the audio(s) is a part of





<\/td>		\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0438\u043c\u044f \u043c\u0435\u0434\u0438\u0430\u0433\u0440\u0443\u043f\u043f\u044b, \u0447\u0430\u0441\u0442\u044c\u044e \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0430\u0443\u0434\u0438\u043e (\u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b \u0442\u0430\u043a \u0438 \u043d\u0435 \u0432\u043d\u0435\u0434\u0440\u0438\u043b\u0438 \u044d\u0442\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c<\/strong>.) \u0412\u043d\u0438\u0437\u0443 \u043f\u0440\u0438\u043c\u0435\u0440 \u043a\u0430\u043a \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0434\u0432\u0443\u043c\u044f \u043f\u043b\u0435\u0435\u0440\u0430\u043c\u0438 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c JS.<\/td><\/tr>
muted<\/a><\/td>Sets or returns whether the sound should be turned off<\/td>\u0417\u0432\u0443\u043a \u0432\u043a\u043b\u044e\u0447\u0435\u043d \u0438\u043b\u0438 \u0432\u044b\u043a\u043b\u044e\u0447\u0435\u043d.
<\/td><\/tr>
networkState<\/a><\/td>Returns the current network state of an audio<\/td><\/td><\/tr>
paused<\/a><\/td>Returns whether an audio is paused<\/td><\/td><\/tr>
playbackRate<\/a><\/td>Sets or returns the speed of the audio playback<\/td><\/td><\/tr>
played<\/a><\/td>Returns a TimeRanges object representing the played parts of the audio<\/td><\/td><\/tr>
preload<\/a><\/td>Sets or returns the value of the preload attribute of an audio<\/td><\/td><\/tr>
readyState<\/a><\/td>Returns the current ready state of an audio<\/td><\/td><\/tr>
seekable<\/a><\/td>Returns a TimeRanges object representing the seekable parts of an audio<\/td><\/td><\/tr>
seeking<\/a><\/td>Returns whether the user is currently seeking in the audio<\/td><\/td><\/tr>
src<\/a><\/td>Sets or returns the value of the src attribute of an audio<\/td><\/td><\/tr>
textTracks<\/a><\/td>Returns a TextTrackList object representing the available text tracks<\/td><\/td><\/tr>
volume<\/a><\/td>Sets or returns the audio volume of an audio<\/td><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
\n\n\n\n
Audio Object Methods<\/h2>\n\n\n\n
Method<\/th>Description<\/th><\/tr>
addTextTrack()<\/a><\/td>Adds a new text track to the audio<\/td><\/tr>
canPlayType()<\/a><\/td>Checks whether the browser can play the specified audio type<\/td><\/tr>
fastSeek()<\/td>Seeks to a specified time in the audio player<\/td><\/tr>
getStartDate()<\/td>Returns a new Date object, representing the current timeline offset<\/td><\/tr>
load()<\/td>Re-loads the audio element<\/td><\/tr>
play()<\/a><\/td>Starts playing the audio<\/td><\/tr>
pause()<\/a><\/td>Pauses the currently playing audio<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
<\/p>\n\n\n\n
\n\n\n\n
<\/p>\n\n\n\n
\u0412 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u0432\u0435\u0431-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0430\u0446\u0438\u0435\u0439 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0430\u0443\u0434\u0438\u043e \u043f\u0440\u043e\u0449\u0435 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e JavaScript<\/strong>:<\/p>\n\n\n\n
<!DOCTYPE html>\n<html lang=\"ru\">\n<head>\n<meta charset=\"UTF-8\">\n<title>media-group<\/title>\n<\/head>\n<body>\n\n<h1>\u0421\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0430\u0446\u0438\u044f \u0430\u0443\u0434\u0438\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e media-group<\/h1>\n\n<audio id=\"audio1\" src=\".\/audio\/original_de_audio_Hoeren-Sprechen_A2_Track_002.mp3\" controls><\/audio>\n<audio id=\"audio2\" src=\".\/audio\/ru_audio_tra_Hoeren-Sprechen_A2_Track_002.mp3\" controls><\/audio>\n\n<script>\n  const audio1 = document.getElementById('audio1');\n  const audio2 = document.getElementById('audio2');\n\n  audio1.addEventListener('play', () => {\n    audio2.play().catch((err) => console.error(err)); \/\/ \u0412 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u043c\u043e\u0436\u0435\u0442 \u0441\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c autoplay policy\n  });\n\n  audio1.addEventListener('pause', () => {\n    audio2.pause();\n  });\n<\/script>\n\n<\/body>\n<\/html>\n<\/pre>\n\n\n\n
<\/p>\n\n\n\n
<\/p>\n\n\n\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
https:\/\/www.w3schools.com\/jsref\/dom_obj_audio.asp HTML DOM Audio Object Audio Object The Audio object represents an HTML <audio> element.Access an Audio ObjectYou can access an <audio> element by using getElementById(): Audio Object \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 HTML \u0414\u043e\u0441\u0442\u0443\u043f \u043a Audio Object\u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443 Create an Audio ObjectYou can create an <audio> element by using the document.createElement() method: \u0421\u043e\u0437\u0434\u0430\u0442\u044c \u0430\u0443\u0434\u0438\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0412\u044b… \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 »javascript audio play<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":""},"categories":[195,6],"tags":[],"class_list":["post-7201","post","type-post","status-publish","format-standard","hentry","category-it","category-js"],"_links":{"self":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts\/7201","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7201"}],"version-history":[{"count":19,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts\/7201\/revisions"}],"predecessor-version":[{"id":7229,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts\/7201\/revisions\/7229"}],"wp:attachment":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7201"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=7201"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=7201"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}