javascript - 如何提取列表的第一个元素并用它来替换jquery中的列表？

Question

原始的 HTML 代码是这样的：

<div>
<ul class="alt">
   <li> <a class="button1"> Button1 </a></li>
   <li> <a class="button2"> Button2 </a></li>
</ul>
</div>

然后我想把它改成这样：

<div>
  <a class="button1"> Button1 </a>
</div>

有谁知道如何在 jquery 中实现这个？

Answer 1

.first()您可以通过或获得拳头元素:first Selector

$('div').html($('div li:first').html())

或尝试

$("div").html($('li').first().html());

提琴手

Answer 2

你可以这样做。

现场演示

$('.alt').closest('div').html($('.alt li:first').html());

Its better to assign some id to div you are intending to make it unique, 以便您所做的更改仅限于此 div。

HTML

<div id="div1">
<ul class="alt">
   <li> <a class="button1"> Button1 </a></li>
   <li> <a class="button2"> Button2 </a></li>
</ul>
</div>

Javascript

$('#div1').html($('#div1 li:first').html());

Answer 3

或这个 ：）

$('.alt').replaceWith( $('.alt>li:eq(0)').contents() );

或者只是为了好玩：

$('.alt>li:eq(0)').unwrap().siblings().remove().end().contents().unwrap();