ページが読み込まれてから秒後にテキストを表示する（バニラJavaScript）

Question

ページが読み込まれてから数秒後に表示されるようにするdivタグがいくつかあります。あなたはjQueryで答えることができますが、バニラJSが好まれます。私はここでスタックで見つけた答えをいくつか試しましたが、うまくいきませんでした。

Answer 1

setTimeout(() => document.querySelector('div').classList.add('show'), 1000);

div { 
 
    opacity: 0; 
 
    transition: opacity 2s; 
 
} 
 

 
.show { 
 
    opacity: 1; 
 
}

<div>Hello</div>

Answer 2

あなたがJSでそれをやっていることを同意する。 Jqueryはありません。私の提案は、DOMの準備ができるまで待つことです。 divにクラスを追加します。 次のクラスには不透明度があります。デフォルトでは;あなたのdivに不透明度があります：0。

document.addEventListener("DOMContentLoaded", function(event) { 
    setTimeout(function(){ 
    console.log("Let's show my div"); 
    document.getElementsById("mydiv").setAttribute("class", "visibleClass"); 
    }, 3000); 
}); 

Answer 3

window.addEventListener("load", function() { 
    setTimeout(function() { 
     document.getElementById("someId").style.display="block"; 
    }, 2000); 
}) 

ID "someId" とのあなたのDIVのスタイル= "表示：なし" 持っている必要があり