как заменить ul на новый ul

#jquery

#jquery

Вопрос:

как мне использовать jquery для замены того, что у меня есть в первом ul, на то, что у меня есть во втором ul?

 $('li').each(function() {
  alert($(this).text()); //so far this is what I have which alerts me with all the li's text.
});
  

 <ul>
   <li>apple</li>
   <li>peach</li>
  

 <ul>
   <li>juice</li>
   <li>candy</li>
</ul>
  

Ответ №1:

 $('ul').eq(0)
   .replaceWith($('ul').eq(1));
  

Скрипка: http://jsfiddle.net/c4vh9 /

Комментарии:

1. Почти 25 тыс. пользователей, и вы пишете такой неэффективный код? -1, чувак.

2. @MattBall — это работает, не так ли? как бы вы сделали это более эффективным? (кстати, репутация не имеет ничего общего с навыками кодирования)

3. Кэлвин, пожалуйста, обратите внимание, что в основном это говорит о замене первого ul на странице вторым ul (эквалайзер основан на нуле). Вы можете заменить в своих собственных селекторах, если хотите быть более явным. $('ul#first').replaceWith($('ul#second'));

4. @Мэтт Болл: Мы с замиранием сердца ждем вашей высокоэффективной альтернативы.

5. Не запрашивайте повторно DOM без необходимости, как в ответе jfriend00. jsfiddle.net/mattball/MuFa3

Ответ №2:

Чтобы избежать многократной оценки селекторов, вы могли бы сделать это:

 var uls = $("ul");
uls.eq(0).html(uls.eq(1).html());
  

При этом будет получен объект jQuery со списком <ul> элементов в нем.
eq(0) получает первый ul и устанавливает его innerHTML в innerHTML eq(1) второго ul.

Или с немного меньшим количеством jQuery и, возможно, немного большей удобочитаемостью:

 var uls = $("ul");
uls[0].innerHTML = uls[1].innerHTML;