Web API HTMLMediaElement captureStream() Method Last Updated : 22 Jul, 2024 Summarize Comments Improve Suggest changes Share Like Article Like Report The HTMLMediaElement API provides the properties and methods required to implement fundamental media-related capabilities that are common to audio and video. The captureStream() method is used to perform a real-time capture of the content being rendered in the media element.Syntax:captureStream()Parameters: This method doesn't accept any parameter.Return Value: It returns the MediaStream object, which can be utilized for other media processing code, as a source for audio and/or video. Example 1: This example illustrates the basic usage of the HTMLMediaElement.captureStream() method. HTML <!DOCTYPE html> <html> <body style="text-align: center;"> <h1 style="color:green"> GeeksforGeeks </h1> <h3> HTMLMediaElement API captureStream method </h3> <video id="video" style="height: 250px; width: 400px;" onplay="playHandler()" crossorigin controls src="GeeksforGeeks.mp4"> Browser not supported </video> <script> function playHandler() { let video = document.getElementById('video'); let stream = video.captureStream(); console.log(stream); } </script> </body> </html> Output: Example 2: This example illustrates the use of the HTMLMediaElement.captureStream() method, where we are extracting the audio from its video. HTML <!DOCTYPE html> <html> <body style="text-align: center;"> <h1 style="color:green"> GeeksforGeeks </h1> <h3> HTMLMediaElement API captureStream method </h3> <video id="video" style="height: 250px; width: 400px;" onplay="playHandler()" crossorigin controls src="GeeksforGeeks.mp4"> Browser not supported </video> <script> function playHandler() { let video = document.getElementById('video'); let videoStream = video.captureStream(); const audioTrack = videoStream.getAudioTracks()[0]; const audioStream = new MediaStream(); audioStream.addTrack(audioTrack); const audio = document.createElement("audio"); audio.controls = true; document.body.append(audio); audio.srcObject = audioStream; audio.volume = 1.0; } </script> </body> </html> Output: Comment More infoAdvertise with us Next Article HTML Audio/Video DOM addTextTrack() Method A aayushmohansinha Follow Improve Article Tags : Technical Scripter JavaScript Web Technologies Technical Scripter 2022 Web-API JavaScript-Methods +2 More Similar Reads Web API WebRTC.getUserMedia() Method The MediaDevices.getUserMedia() is a part of the webRTC media capture API and is used to get access to the camera and the microphone connected to the user device (user computer, smartphone, etc.) from the browser. When getUserMedia() is invoked, the browser asks for permission from the user to use t 12 min read Web StyleElement API | StyleElement media property In Web API there are style elements which have media attribute. To fetch this media attribute we use HTMLStyleElement.media property, which specifies the intended destination medium for style information. Syntax: label = style.media style.media = label label is a string which describes a single medi 1 min read HTML DOM Audio/Video Complete Reference HTML DOM Audio/Video properties and methods allow developers to control audio and video elements programmatically.These controls include playing, pausing, stopping, and adjusting volume.DOM methods enable dynamic interaction and customization of media elements.They enhance the user experience by off 2 min read Different ways to add media in HTML page These days one of the most important things on the web is media. So all the developers and websites owners want to make their websites attractive and interactive. For they need to include media in their sites. There are lots of media types, audio, video, etc. There are different ways to include thos 2 min read HTML Audio/Video DOM addTextTrack() Method The HTML Video DOM addTextTrack() Method is used to create or return the new TextTrack of a video Element. The new TextTrack is added to the list of all TextTracks of a Video Element. Syntax: audio/video.addTextTrack(kind, label, language) Parameter Values: Kind: It specifies the Kind of the TextTra 1 min read Web API Picture-in-Picture Web API Picture-in-Picture feature enables websites to display a video in a floating window that stays on top of windows. This allows users to keep watching videos while interacting with content or applications, on their device. Concepts and usage Multitasking: PiP allows users to watch a video whil 5 min read Like