javascript - jQuery:需要更改特定的列表元素

Question

目前我正在开发 Image Gallery 应用程序。它有 <img>在 li元素。

代码如下:

var $slideR_wrap = $(".slideRoller_wrapper");
var $slidesRoller = $slideR_wrap.find(".slidesRoller");
var $slideRoller = $slidesRoller.find(".slideRoller");
var $sliderImage = $slideRoller.find(".rollerImage");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="slideRoller_wrapper">
  <ul class="slidesRoller" id="slidesRoller">
    <li class="slideRoller">
      <img class="rollerImage" src="../../assets/img/slider/1.jpg">
    </li>
    <li class="slideRoller">
      <img class="rollerImage" src="../../assets/img/slider/2.jpg">
    </li>
    <li class="slideRoller">
      <img class="rollerImage" src="../../assets/img/slider/3.jpg">
    </li>
    <li class="slideRoller">
      <img class="rollerImage" src="../../assets/img/slider/4.jpg">
    </li>
  </ul>
</div>

如何定位 li 的特定元素？作为数组元素？

当我做的时候console.log($sliderImage) ，我得到了所有图像的数组。当我尝试 $(".rollerImage")[0].css('opacity','1'); ，它引发了一个错误:

Uncaught TypeError: $(...)[0].css is not a function.

我需要访问一个特定的 image特别是li通过使用数组索引。

这是我元素的最后一步，我真的不想改变逻辑重新开始。

Answer 1

你需要的是 nth-child() 选择器。

文档:https://api.jquery.com/nth-child-selector/

例子:https://www.w3schools.com/jquery/sel_nthchild.asp