回答編集履歴

2

修正

2020/04/22 09:35

投稿

new1ro
new1ro

スコア4528

test CHANGED
@@ -6,7 +6,7 @@
6
6
 
7
7
  ```HTML
8
8
 
9
- <div class="arrayPicture">
9
+ <div class="arrayPicture" id="arrayPicture"><!-- idを追加 -->
10
10
 
11
11
  <!--
12
12
 

1

JavaScriptの記述を追加しました。

2020/04/22 09:35

投稿

new1ro
new1ro

スコア4528

test CHANGED
@@ -8,7 +8,7 @@
8
8
 
9
9
  <div class="arrayPicture">
10
10
 
11
-
11
+ <!--
12
12
 
13
13
  <div class="img img1">
14
14
 
@@ -20,21 +20,9 @@
20
20
 
21
21
  </div>
22
22
 
23
+ -->
23
24
 
24
-
25
- <div class="img img2">
26
-
27
- <p>sample2</p>
28
-
29
- <a href="img2.html">Figure</a>
30
-
31
- <img src="pic2.png">
32
-
33
- </div>
25
+ </div>
34
-
35
-
36
-
37
- </div>
38
26
 
39
27
  ```
40
28
 
@@ -105,3 +93,33 @@
105
93
 
106
94
 
107
95
  ```
96
+
97
+
98
+
99
+ ↓追加: 連番になっている前提です。
100
+
101
+ ```JS
102
+
103
+ let arrayPicture = document.getElementById('arrayPicture');
104
+
105
+
106
+
107
+ for (let i = 1; i <= 100; i++) {
108
+
109
+ var html = '';
110
+
111
+ html += '<div class="img img' + i + '">';
112
+
113
+ html += '<p>sample' + i + '</p>';
114
+
115
+ html += '<a href="img' + i + '.html">Figure</a>';
116
+
117
+ html += '<img src="pic' + i + '.png">';
118
+
119
+ html += '</div>';
120
+
121
+ arrayPicture.insertAdjacentHTML('beforeend', html);
122
+
123
+ }
124
+
125
+ ```