Gepufferten Audio-Prozentsatz anzeigen

Question

Warum kann ich den gepufferten Audio-Prozentsatz in Javascript nicht anzeigen?

var audio = document.getElementById("aone1"); 
 
var percentages = document.getElementById("aone1l"); 
 

 
function loop() { 
 
    var buffered = audio.buffered; 
 
    var loaded; 
 
    var played; 
 

 
    if (buffered.length) { 
 
    loaded = 100 * buffered.end(0)/audio.duration; 
 
    played = 100 * audio.currentTime/audio.duration; 
 
    percentages[0].innerHTML = loaded.toFixed(2); 
 
    percentages[1].innerHTML = played.toFixed(2); 
 
    } 
 

 
    setTimeout(loop, 50); 
 
} 
 

 
loop();

<audio id="aone1" controls="controls"> 
 
    <source src="http://jainvidhya.epizy.com/Audio/Part1/ऑडियो नंबर 1 नमस्कार महामंत्र.mp4"> 
 
</audio> 
 
<p>Loaded: <span id="aone1l"></span>%</p> 
 
<p>Played: <span id="aone1l"></span>%</p>

auch, warum die Audio-laden viel Zeit in Anspruch nimmt?

Answer 1

Verwenden Sie eindeutige id oder Nutzungsklassen statt hier, die ein Array geben und stellen Sie dann die innerHTML:

var audio = document.getElementById("aone1"); 
 
var percentages = document.getElementsByClassName("aone1l") 
 

 
function loop() { 
 
    var buffered = audio.buffered; 
 
    var loaded; 
 
    var played; 
 

 
    if (buffered.length) { 
 
    loaded = 100 * buffered.end(0)/audio.duration; 
 
    played = 100 * audio.currentTime/audio.duration; 
 
    percentages[0].innerHTML = loaded.toFixed(2); 
 
    percentages[1].innerHTML = played.toFixed(2); 
 
    } 
 

 
    setTimeout(loop, 50); 
 
} 
 

 
loop();

<audio id="aone1" controls="controls"> 
 
    <source src="https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3"> 
 
</audio> 
 
<p>Loaded: <span class="aone1l"></span>%</p> 
 
<p>Played: <span class="aone1l"></span>%</p>