Question

我想在这里制作一个旋转木马。

这是我的标记

<img  class="fullBg anim" src="img/bgs/1.jpg" >
<img  class="fullBg anim" src="img/bgs/2.jpg" >
<img  class="fullBg anim" src="img/bgs/3.jpg" >
<img  class="fullBg anim" src="img/bgs/4.jpg" >

现在我想选择第一个图像或第二个图像而不给每个图像一个id。请告诉我该怎么做。我尝试了n-th child，但它没有用。感谢。

Answer 1

您可以使用：

$('.fullBg').each(function() {
    // $(this) here will target each of your image with class fullBg 
});

如果您想定位第一张图片，可以使用：

$('img.fullBg:eq(0)');

您可以在此处使用 :nth-child() ，但需要将图片包装在div内，例如：

<div class="test">
    <img  class="fullBg anim" src="img/bgs/1.jpg" >
    <img  class="fullBg anim" src="img/bgs/2.jpg" >
    <img  class="fullBg anim" src="img/bgs/3.jpg" >
    <img  class="fullBg anim" src="img/bgs/4.jpg" >
</div>

然后你可以使用：

$(".test img:nth-child(1)")

定位您的第一张图片或：

$(".test img:nth-child(2)")

定位您的第二张图片。

Answer 2

你需要将这个html包装在像div这样的父元素中。然后尝试：

$(parentselector).find("img:eq(1)");//for second image
$(parentselector).find("img:eq(0)");//for first image

Answer 3

您可以使用:eq()选择第一，第二等..

$('img.fullBg:eq(1)'); //selects 2nd image

Answer 4

您可以使用eq()方法，索引从0开始，使用负值从结束

中选择

$('img.fullBg').eq(0)//select first image

Fiddle Demo

以上示例选择第一张图片，以便将0改为1

Documentation

Answer 5

只需拥有自己的css选择器并提供自己的号码，而不是（2）

selector:nth-of-type(2)

DEMO

Answer 6

这样的东西可以工作（未经测试），它会从列表中删除第一个并将其添加到最后：

setInterval(function() { 
          $('#slidediv > div:first')
            .fadeOut(1000)
            .next()
            .fadeIn(1000)
            .end()
            .appendTo('#slidediv');
        },  5000);

您需要将标签包装在名为#slidediv

的div中

Answer 7

对于第一个元素：

$('.fullBg').eq(0);

从同一类中的图像列表中选择图像

7 个答案: