JavaScript to parse and show current time stamp of an HTML audio player.

JavascriptWeb DevelopmentObject Oriented Programming

Following is the code to to parse and show current time stamp of an HTML audio player −


 Live Demo

<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   .result {
      font-size: 20px;
      font-weight: 500;
<h1>Show Current time stamp of an HTML audio player</h1>
class="audio" src="C:\Users\titan\Downloads\sample.mp3" controls></audio>
<div style="color: green;" class="result"></div>
<button class="Btn">CLICK HERE</button>
<h3>Click on the above button to get the audio timestamp</h3>
   let resEle = document.querySelector(".result");
   let BtnEle = document.querySelector(".Btn");
   let audioEle = document.querySelector(".audio");
   BtnEle.addEventListener("click", () => {
      resEle.innerHTML = "Minutes = " + Math.floor(audioEle.currentTime / 60) + "";
      resEle.innerHTML += "Seconds = " + Math.floor(audioEle.currentTime % 60) + "";


The above code will produce the following output −

On playing the audio and clicking on ‘CLICK HERE’ after some time −

Updated on 18-Jul-2020 07:31:39