предложения по оптимизации моего jquery

Question

предложения по оптимизации моего jquery

0

Вместо того, чтобы писать такие строки снова и снова, какой должен быть профессиональный способ и оптимизированный способ написать этот же код? Пожалуйста помоги

$(function(){

$('<img src="map/map_slice_1.jpg"/>').appendTo('#map_slice_1');
$('<img src="map/map_slice_2.jpg"/>').appendTo('#map_slice_2');
$('<img src="map/map_slice_3.jpg"/>').appendTo('#map_slice_3');
$('<img src="map/map_slice_4.jpg"/>').appendTo('#map_slice_4');
$('<img src="map/map_slice_5.jpg"/>').appendTo('#map_slice_5');
$('<img src="map/map_slice_6.jpg"/>').appendTo('#map_slice_6');
$('<img src="map/map_slice_7.jpg"/>').appendTo('#map_slice_7');
$('<img src="map/map_slice_8.jpg"/>').appendTo('#map_slice_8');             

});

subho das 23 нояб. 2013, в 16:27

Источник

Теги:

javascript

jquery

jquery-ui

4 ответа

2

$('[id^="map_slice_"]').append(function() { 

  return $('<img />', {src: 'map/' + this.id + '.jpg'});

});

Попробуйте Fiddle

moonwave99 23 нояб. 2013, в 11:58

1

Вам не нужна карта!
adeneo 23 нояб. 2013, в 15:04
0

$('[id^="map_slice_"]').append(function() { return $('<img />', {src: 'map/' + this.id + '.jpg'}); });
adeneo 23 нояб. 2013, в 15:05
0

@adeneo спасибо! ^^
moonwave99 23 нояб. 2013, в 15:25
0

+1 Хороший :) Но почему бы не вернуть строку?
leaf 23 нояб. 2013, в 16:35
0

@wared ty ^^ Я считаю, что создание DOM-элемента удобнее для чтения и сопровождения, а не путаницы с конкатенацией строк.
moonwave99 23 нояб. 2013, в 16:48
0

Ну, я точно думал об обратном, я нахожу это менее читабельным и понятным ^^ В любом случае, это не имеет значения, это не тот вопрос, который делает ваш ответ интересным :)
leaf 23 нояб. 2013, в 16:54

Показать ещё 4 комментария

0

Для оптимизации не уверены, но для ремонтопригодности и количества строк:

for(var i=1; i<=8 i++) {
  $('<img src="map/map_slice_'+i+'.jpg"/>').appendTo('#map_slice_'+i);
}

Можно найти лучшие пути для достижения этого. Знание контекста могло бы помочь.

Kustolovic 23 нояб. 2013, в 13:17

0

пытаться

$(function(){
  for (var i=0; i<8; i++)
  {
     $('<img src="map/map_slice_" + i + ".jpg"/>').appendTo('#map_slice_' + i);
  }   

});

vijaykumar 23 нояб. 2013, в 11:54

Ещё вопросы

$('[id^="map_slice_"]').append(function() { return $('<img />', {src: 'map/' + this.id + '.jpg'}); });
+1 Хороший :) Но почему бы не вернуть строку?
@wared ty ^^ Я считаю, что создание DOM-элемента удобнее для чтения и сопровождения, а не путаницы с конкатенацией строк.
Ну, я точно думал об обратном, я нахожу это менее читабельным и понятным ^^ В любом случае, это не имеет значения, это не тот вопрос, который делает ваш ответ интересным :)

leaf · Accepted Answer · 2013-11-23T14-36-00.000Z

Я бы сделал что-то вроде этого:

$(function () {
    var i = 0; 
    while (i++ < 8) {
        $('#map_slice_' + i).append(
            '<img src="map/map_slice_' + i + '.jpg"/>'
        );
    }
});