2016-10-20 8 views
0

このコードはループして複数のdivを追加する予定ですが、動作しません。クリックすると、1つのdivだけが表示されます。もう一度クリックすると、何も起こりません。appendChildを使用してdivを追加してください

<body> 
    <div class="start" > 
     <div id = "coba"> 
     </div> 

     <div id = "cobi"> 
     </div> 
    </div> 
    <script> 
     var divs = document.getElementById("coba").addEventListener("click", function() { 

      for (var i = 1; i < 100; i++) { 
       var di = document.createElement('div'); 
       document.getElementById('coba').appendChild(di); 

      } 
     }); 
    </script> 
</body> 

あなたは、変数「i」のための文の中で何もしませんでしたので、ご協力いただきありがとうござい

+0

それはどのなければこちら** **](https://jsfiddle.net/227u9dpp/) – brk

+1

細かいチェックを働いていますスタイリングやコンテンツでは、複数のdiv要素が空であり、垂直方向のスペースがないので視覚的に表示されません –

+0

@PatrickEvansの言っていることを確認できます。私はあなたのコードをここjsfiddleで手に入れました:[https://jsfiddle.net/q36tpLfL/1/](https://jsfiddle.net/q36tpLfL/1/)。私は何かを見ることができるようにテキストを投げたが、それはうまくいくように見える。 –

答えて

0

は、あなたのコードは動作しません。あなたがuser2181397 & meghan Armesの手品を見ると、それがスクリプトに行を追加して動作させる様子がわかります。

は、私は私のIDEに以下の試験をし、それだけで正常に動作します:

<body> 
    <div class="start" style="margin-top:50px; color:black;"> 
     <div id = "coba"> 
     <p>Click Me</p> 
     </div> 

     <div id = "cobi"> 
     </div> 
</div> 

<script> 
var divs = document.getElementById("coba").addEventListener("click", function() { 

for (var i = 1; i < 100; i++) { 
    var di = document.createElement('div'); 
    di.innerHTML=i; 
    document.getElementById('coba').appendChild(di); 

} 
}); 

</script> 
</body> 
+0

あなたの答えに感謝します!しかし、私は別のpoblemを持っているので、実際に私はフラクタルツリーを作成すると仮定し、divの形状は長方形です –

+0

結果はこのようなものですhttps://www.dropbox.com/s/hn0no6aq19nyzw3/Capture.PNG?dl=0とifもう一度クリックすると、何も起こりません。 –

+0

あなたは大歓迎です。フラクタルツリーの別の質問を投稿することをお勧めします。 – sammyb123

関連する問題