バッファされたオーディオのパーセンテージを表示

Question

Javascriptを使用してバッファされたオーディオのパーセンテージを表示できないのはなぜですか？

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>

また、なぜオーディオはロードに時間がかかりますか？

Answer 1

あなたの配列を与え、その後innerHTMLを設定します代わりに、ここでidまたは使用するクラス、ユニークな用途：

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>