回答編集履歴
1
document.createDocumentFragment();で一気に突っ込むようにしました!
test
CHANGED
@@ -74,13 +74,17 @@
|
|
74
74
|
|
75
75
|
//HTML内埋め込みとの境界線
|
76
76
|
|
77
|
+
let frag_node = document.createDocumentFragment();
|
78
|
+
|
77
79
|
const p = document.createElement("p");
|
78
80
|
|
79
81
|
const line = document.createTextNode("-------ここから下がUnderscore.js無しの処理-------");
|
80
82
|
|
83
|
+
|
84
|
+
|
81
85
|
p.appendChild(line);
|
82
86
|
|
83
|
-
|
87
|
+
frag_node.appendChild(p);
|
84
88
|
|
85
89
|
for(let i in list){
|
86
90
|
|
@@ -92,7 +96,7 @@
|
|
92
96
|
|
93
97
|
h3.appendChild(name);
|
94
98
|
|
95
|
-
|
99
|
+
frag_node.appendChild(h3);
|
96
100
|
|
97
101
|
//dl
|
98
102
|
|
@@ -126,9 +130,11 @@
|
|
126
130
|
|
127
131
|
}
|
128
132
|
|
129
|
-
|
133
|
+
frag_node.appendChild(dl);
|
130
134
|
|
131
135
|
}
|
136
|
+
|
137
|
+
document.body.appendChild(frag_node);
|
132
138
|
|
133
139
|
</script>
|
134
140
|
|
@@ -149,3 +155,9 @@
|
|
149
155
|
「配列操作をバリバリする」もしくは「underscore.jsを使用しないといけない」という状況でないのであれば、下のscriptタグのコードの方が扱いやすいのでお勧めです!
|
150
156
|
|
151
157
|
コピペで検証出来ると思いますので参考までに。
|
158
|
+
|
159
|
+
<追記>
|
160
|
+
|
161
|
+
アドバイスを受けて修正版です。
|
162
|
+
|
163
|
+
アドレスありがとうございます!
|