HTMLファイルに2つのdivがあります。Javascript：ページの読み込みにdivを1つだけ表示する方法
<div class="one" id="firstDiv">
</div>
<div class="Two" id="SecondDiv">
</div>
私は唯一のdivクラスクリックアクションが発生したときにページが読み込まれ、最終的には、divの2を示し=「1」を示したいと思います。私はonclickイベントをフェードインする方法を知っていますが、ページが読み込まれるときに最初のdivだけを表示するにはどうしたらいいですか？
、
オプション1オプションの下に使用します。
1.Createにreference- https://codepen.io/nagasai/pen/JNNrpM
オプション2：
1.メイク#SecondDiv表示：最初はなし
2とディスプレイを使用してonclickのそれを利用できるようにする：reference- 0
CodepenのURLをブロックの
JS：
var divTwo = document.getElementById('SecondDiv');
function hideDiv(){
divTwo.style.display ='none';
}
function showDiv(){
divTwo.style.display ='block';
}
HTML：
<html>
<body onload="hideDiv()">
<div class="one" id="firstDiv">111
</div>
<div class="Two" id="SecondDiv">222
</div>
<button onclick="showDiv()">show Div Two</button>
</body>
</html>
オプション2：
HTML:
<html>
<body>
<div class="one" id="firstDiv">111
</div>
<div class="Two" id="SecondDiv">222
</div>
<button onclick="showDiv()">show Div Two</button>
</body>
</html>
CSS：
.Two{
display:none
}
JS：
function showDiv(){
var divTwo = document.getElementById('SecondDiv');
divTwo.style.display ='block';
}
体がクリックされた時、あなたはcreateElement()でページに他のdivを追加するようにするには、クリックイベントを追加することができます。
https://www.w3schools.com/jsref/met_document_createelement.asp
あなただけのdivを一度追加したい場合は、 divの作成に伴い、イベントリスナーを削除することができます。期待される結果を達成するために
あなたはdivは、次のような隠された値に適用するためにCSSを使用することができます開始時に非表示にする場合：
<div class="hidden" id="someIdVal">Lorem Ipsum</div>
.hidden{
display: none;
}
を次にJSを追加/削除
function toggleHidden(id){
document.getElementById(id).classList.toggle('hidden');
}
.Two {表示：なし;}
持つクラスそしてjavascript onclickイベントで：
document.getElementById（ "SecondDiv"）。style.display = "block";
あなたはclass = "Two" display：noneを作成し、上記のようにonclickを利用できるようにします –
2番目のdivを省略し、ボタンクリックでプログラムで作成することができます。または、最初に非表示にしてボタンをクリックしてクラスを削除するクラスを追加することができます – Brian
JavaScriptを使用して[divを表示/非表示]可能な複製（http://stackoverflow.com/questions/21070101/show-hide-div-using - ジャバスクリプト） –