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

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

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

Example

 Live Demo

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result {
      font-size: 20px;
      font-weight: 500;
   }
</style>
</head>
<body>
<h1>Show Current time stamp of an HTML audio player</h1>
<audio
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>
<script>
   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) + "";
   });
</script>
</body>
</html>

Output

The above code will produce the following output −

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

Updated on: 2020-07-18T07:31:39+05:30

1K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements