如何使用jQuery在last li之后显示第一个li

-1

我想要删除第一个li并在最后一个li之后添加使用jQuery。这是我的html代码。如何使用jQuery在last li之后显示第一个li

<ul id="client_list"> 
    <li id="1"><img src="img/client.png"/>1</li> 
    <li id="2"><img src="img/client1.png"/>2</li> 
    <li id="3"><img src="img/client2.png"/>3</li> 
    <li id="4"><img src="img/client3.png"/>4</li> 
    <li id="5"><img src="img/client4.png"/>5</li> 
    <li id="6"><img src="img/client5.png"/>6</li> 
    <li id="7"><img src="img/client6.png"/>7</li> 
</ul>

是否有可能做到与jQuery hide()和show()方法呢？任何帮助高度appriciate。

来源

2016-11-18 Udara

*是否有可能做到与jQuery的hide（）和show（）方法？* - 是*是*一个足以回答你的问题？ –

@PranavCBalan你能告诉我该怎么做？我正在尝试使徽标滑块运行自动并需要将滑块移动到一个方向。为此我需要做那部分。 – Udara

@KilianStinson你能告诉我该怎么做吗？ – Udara

使用insertAfter()以及:first和:last。如果需要，可以使用id属性来选择元素，但这会使代码更脆弱。

$('li:first').insertAfter('li:last');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul id="client_list"> 
 
    <li id="1"><img src="img/client.png"/>1</li> 
 
    <li id="2"><img src="img/client1.png"/>2</li> 
 
    <li id="3"><img src="img/client2.png"/>3</li> 
 
    <li id="4"><img src="img/client3.png"/>4</li> 
 
    <li id="5"><img src="img/client4.png"/>5</li> 
 
    <li id="6"><img src="img/client5.png"/>6</li> 
 
    <li id="7"><img src="img/client6.png"/>7</li> 
 
</ul>

来源

2016-11-18 10:56:28

您可以使用jquery也eq()。但@Rory提出了一个非常简单的方法。但eq()可以在您的列表中找到任何位置。

eq（）方法提供基于0的位置。

$('#client_list').find('li').eq(0).insertAfter('#client_list>li:last');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul id="client_list"> 
 
    <li id="1"><img src="img/client.png"/>1</li> 
 
    <li id="2"><img src="img/client1.png"/>2</li> 
 
    <li id="3"><img src="img/client2.png"/>3</li> 
 
    <li id="4"><img src="img/client3.png"/>4</li> 
 
    <li id="5"><img src="img/client4.png"/>5</li> 
 
    <li id="6"><img src="img/client5.png"/>6</li> 
 
    <li id="7"><img src="img/client6.png"/>7</li> 
 
</ul>

来源

2016-11-18 11:04:19 SilentCoder

你也可以做到这一点，用下面的方法。

var firstLI = $("#client_list li").first(); 
 
$("#client_list").append(firstLI);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<ul id="client_list"> 
 
    <li id="1"><img src="img/client.png"/>1</li> 
 
    <li id="2"><img src="img/client1.png"/>2</li> 
 
    <li id="3"><img src="img/client2.png"/>3</li> 
 
    <li id="4"><img src="img/client3.png"/>4</li> 
 
    <li id="5"><img src="img/client4.png"/>5</li> 
 
    <li id="6"><img src="img/client5.png"/>6</li> 
 
    <li id="7"><img src="img/client6.png"/>7</li> 
 
</ul>

来源

2016-11-18 11:07:30 Samir

如何使用jQuery在last li之后显示第一个li

回答

相关问题