質問編集履歴

3

追記

2019/04/01 16:55

投稿

WeilSpinor
WeilSpinor

スコア170

test CHANGED
File without changes
test CHANGED
@@ -263,3 +263,61 @@
263
263
  問題の核心的な部分を理解する糸口を最初に示して頂いたmaisumakun様をベストアンサーにさせて頂きたいと思います。
264
264
 
265
265
  他の皆さまも、とても参考になりました!ご回答ありがとうございました!
266
+
267
+
268
+
269
+ 最後に、修正したjsのコードを這っておきます。
270
+
271
+ setInterval毎にcreateElementを発動するように、createElementのところもzoushoku(){}の内部に包んでやりました。
272
+
273
+ ```javascript
274
+
275
+ window.onload = function() {
276
+
277
+
278
+
279
+
280
+
281
+ /*hakoが住んでいるdivエレメント領域をwrapperとする。*/
282
+
283
+ var wrapper = document.getElementById("wrapper");
284
+
285
+ /*hakoの増殖関数*/
286
+
287
+ function zoushoku(){
288
+
289
+ /*増殖するhakoの設計図*/
290
+
291
+ /*createElementは同じ宣言から生まれたオブジェクトは同じものとみなされ、
292
+
293
+ * appendCHild標準機能である「同一オブジェクトの追加時には元のものを削除」
294
+
295
+ が発動してしまうため、この関数の内部に記述して、
296
+
297
+ 次から次へとcreateElementを宣言しなおさなければならない。
298
+
299
+ そうすることで、「別々のcreateElement」から「別々のオブジェクト」がちゃんと生成される*/
300
+
301
+ var hako = document.createElement("div");
302
+
303
+ hako.className = "hako";//class名はhako
304
+
305
+ wrapper.appendChild(hako);//子ノードリストにノードを追加
306
+
307
+ };//こうして関数宣言によってラッピングしてやれば、setIntervalは勝手に実行しない。
308
+
309
+ var start = document.getElementById("startBtn");//増殖スタート
310
+
311
+ start.addEventListener("click", function(){
312
+
313
+ setInterval(zoushoku,2000)
314
+
315
+ });
316
+
317
+
318
+
319
+ };
320
+
321
+
322
+
323
+ ```

2

追記

2019/04/01 16:55

投稿

WeilSpinor
WeilSpinor

スコア170

test CHANGED
File without changes
test CHANGED
@@ -255,3 +255,11 @@
255
255
 
256
256
 
257
257
  どう思われますか?ご回答宜しくお願いします。
258
+
259
+ ###追記
260
+
261
+ ベストアンサーにとても迷いましたが、今回は、
262
+
263
+ 問題の核心的な部分を理解する糸口を最初に示して頂いたmaisumakun様をベストアンサーにさせて頂きたいと思います。
264
+
265
+ 他の皆さまも、とても参考になりました!ご回答ありがとうございました!

1

タグ追加

2019/04/01 16:32

投稿

WeilSpinor
WeilSpinor

スコア170

test CHANGED
File without changes
test CHANGED
File without changes