オンクリックdiv置換の遅延

Question

div 1の領域をクリックすると、即座にdiv 2に置き換えられます。移行の間に10秒の遅延を追加するにはどうすればよいですか？

<div id = "div1" style="display:block" onclick = "replace()">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ipsum leo, scelerisque at dapibus ac, consectetur vel ipsum. </div> 
<div id = "div2" style="display:none">Cras suscipit ullamcorper elit vitae sodales. Sed euismod felis molestie lorem gravida a venenatis risus sollicitudin. Proin accumsan lorem in est adipiscing faucibus. </div> 

<script type = "text/javascript"> 
function replace() { 
document.getElementById("div1").style.display="none"; 
document.getElementById("div2").style.display="block"; 
} 

</script> 

Answer 1

javascriptのsetTimeout関数を使用できます。 交換機能を次のように変更してください。

function replace() { 
document.getElementById("div1").style.display="none"; 
setTimeout(function(){ 
document.getElementById("div2").style.display="block";}, 10000); 
}