Display-Spannungsklasse in nach der eingestellten Zeit

Question

Was ich versuche zu erreichen, ist mit JavaScript-Anzeige diese beiden Spannen nach fünf Sekunden für die erste und 10 Sekunden für die zweite.

<span class="5-seconds">Connecting...</span> 
<span class="10-seconds">Connection Established<span> 

unsicher, wie ich dies nur mithilfe von Javascript Dankeschön für die Hilfe erreichen würde.

Answer 1

Verwenden SetTimeout

hier zunächst aus i beide Spannweiten: keine, 5 Sekunden nach dem html im auftauchen ersten div und nach 10 Sekunden zweiten div wird

window.onload = function() { 
 
    ShowSpans('first', 5); 
 
    ShowSpans('second', 10); 
 
} 
 

 

 
function ShowSpans(classname, time) { 
 
    setTimeout(function() { 
 

 
    document.getElementsByClassName(classname)[0].style.display = "block"; 
 
    }, time * 1000); 
 

 
}

span { 
 
    display: none; 
 
}

<span class="first">Connecting...</span> 
 
<span class="second">Connection Established<span>

gezeigt vollständig gerendert wird

Hope this

Answer 2

setTimeout(function() { 
 
    document.getElementById("x").className = "hidden"; 
 
    document.getElementById('y').style.display = 'block'; 
 
}, 5000); 
 
setTimeout(function() { 
 
    document.getElementById('y').style.display = 'none'; 
 
}, 10000);

.fiveSeconds { 
 
    background-color: lightblue; 
 
} 
 
.tenSeconds { 
 
    background-color: lightgreen; 
 
    display: none; 
 
} 
 
.hidden { 
 
    display: none; 
 
}

<div id='x' class='fiveSeconds'>Connecting...</div> 
 
<div id='y' class='tenSeconds'>Connected!</div>

hilft