質問編集履歴

1

改善の追記

2019/12/13 02:01

投稿

risu
risu

スコア6

test CHANGED
File without changes
test CHANGED
@@ -223,3 +223,101 @@
223
223
 
224
224
 
225
225
  以上です。何卒、宜しくお願い申し上げます。
226
+
227
+
228
+
229
+ ###改善の追記
230
+
231
+ maisumakun様のアドバイスを受けまして、以下「keisoku_3();」です。
232
+
233
+ 【改善1】として「.clone()」を使い、【改善2】としてクラス付与を変更致しました。
234
+
235
+
236
+
237
+ ですが「$html」が取得できないようで、要素の挿入がされない状況になってしまいました。
238
+
239
+ 困ったことにエラーも出ておらず、悪いところがわかりません。
240
+
241
+
242
+
243
+ お気づきの点ございましたらご指摘いただければと思い、ここに追記させて頂きました。
244
+
245
+ ```js
246
+
247
+
248
+
249
+ /*
250
+
251
+ keisoku_3();
252
+
253
+ maisumakun様のアドバイスを受けて
254
+
255
+ ----------------------------------------------*/
256
+
257
+ // 計測を実行
258
+
259
+ keisoku_3();
260
+
261
+ function keisoku_3(){
262
+
263
+
264
+
265
+ var time_before = new Date().getTime();
266
+
267
+
268
+
269
+ var $html;
270
+
271
+ for ( var i = 0; i < 3; i++ ) {
272
+
273
+ var data = { num:i, ttl:'hello_'+i };
274
+
275
+
276
+
277
+ if ( i == 0 ){
278
+
279
+ // 【改善1】1回目だけjQeury化する
280
+
281
+ var html = get_outline_html( '' ); // 【改善2】iを渡してクラス付与しない
282
+
283
+ var $html = $( html )
284
+
285
+ .find( '.ttl' ).text( data.ttl )
286
+
287
+ .find( '.num' ).text( data.num )
288
+
289
+ .find( '.box' ).addClass( 'num'+i ); // 【改善2】ここでクラス付与する
290
+
291
+ }else{
292
+
293
+ // 【改善1】2回目以降は.clone()する
294
+
295
+ var $html = $html.clone();
296
+
297
+ $html
298
+
299
+ .find( '.ttl' ).text( data.ttl )
300
+
301
+ .find( '.num' ).text( data.num )
302
+
303
+ .find( '.box' ).addClass( 'num'+i );
304
+
305
+ }
306
+
307
+ $( 'body' ).html( $html[0] ); // $html が取得できていない様子
308
+
309
+ }
310
+
311
+
312
+
313
+ var time_after = new Date().getTime();
314
+
315
+ console.log( 'keisoku_3() = ' + parseInt(time_after - time_before) );
316
+
317
+ }
318
+
319
+
320
+
321
+
322
+
323
+ ```