HTML | DOM Track readyState property

Last Updated : 07 Nov, 2019

The DOM track readyState property is used to return the value of the current ready state of the track. It is a read-only property, and ready state denotes that the track is ready to play or not.

Syntax:

trackObject.readyState

Return Values: It returns a number which represent whether the track is ready to play or not.

0 = NONE => It means the text track has not been obtained
1 = LOADING => It means there are no errors in text track loading and more cues can still be added to the track through the parser.
2 = LOADED => It means the text track has been loaded with no errors.
3 = ERROR => It means the text track was enabled, but something failed when the user tries to obtain it.

Example:

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        HTML DOM Track readyState Property 
    </title> 
</head> 
  
<body style="text-align:center;"> 
  
    <h1 style="color:green;"> 
        GeeksforGeeks 
    </h1> 
      
    <h4>Track readyState Property</h4> 
  
    <video width="100" height="100" controls> 
  
        <track src= 
"https://write.geeksforgeeks.org/wp-content/uploads/11.mp4"
            id="myTrack1" kind="subtitles"
            srclang="en" label="English"> 
  
        <source id="myTrack" src= 
"https://write.geeksforgeeks.org/wp-content/uploads/11.mp4"
                    type="video/mp4"> 
  
    </video> 
  
    <p> 
        Click the button to get the 
        readyState of the track. 
    </p> 
  
    <button onclick="myFunction()"> 
        Get readyState 
    </button> 
  
    <p id="gfg"></p> 
      
    <!-- Script to get readyState property -->
    <script> 
        function myFunction() { 
            var x = document.getElementById("myTrack1"); 
              
            document.getElementById("gfg").innerHTML 
                        = x.readyState; 
        } 
    </script> 
</body> 
  
</html> 