Question

我需要找到这个元素：

<plugin>
    <groupId>org.jacoco</groupId>
    <artifactId>jacoco-maven-plugin</artifactId>
    <version>0.7.8</version>
    <configuration>
        <fileSets>
            <fileSet>
                <directory>..</directory>
                <include>**/target/*.exec</include>
            </fileSet>
        </fileSets>
    </configuration>
    <executions>
        <execution>
            <goals>
                <goal>merge</goal>
            </goals>
        </execution>
    </executions>
</plugin>

当前班级正在改变但我总是需要选择其前一个元素（如果存在）

我试过了：

<ul id="pagin">
  <li><a id="previous">&lt;</a></li>
  <li><a class="pagination">1</a></li>
  ===> <li><a class="pagination">2</a></li> 
  <li><a class="pagination current">3</a></li>
</ul>

也许这不起作用，因为它正在使用.pagination搜索前一个元素，但无法找到选择好元素的方法

Answer 1

您可以使用:has() selector获取<li> a.pagination.current元素，然后使用.prev()获取其前一个兄弟

var prevli = $("#pagin li:has(a.pagination.current)").prev();
var prevLiAnchor = prevli.find('a');

＆＃13;

$("#pagin li:has(a.pagination.current)").prev().css('color', 'red')

＆＃13;

.current{ color : green}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="pagin">
  <li><a id="previous">&lt;</a></li>
  <li><a class="pagination">1</a></li>
  <li><a class="pagination">2</a></li> 
  <li><a class="pagination current">3</a></li>
</ul>

＆＃13;

Answer 2

使用parent和prev。

console.log($("#pagin li a.current").parent().prev('li').find('a').text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="pagin">
  <li><a id="previous">&lt;</a></li>
  <li><a class="pagination">1</a></li>
  ===> <li><a class="pagination">2</a></li> 
  <li><a class="pagination current">3</a></li>
</ul>

Answer 3

＆＃13;

$(function(){
  $("#pagin li").click(function(){
    $("#pagin .pagination").removeClass("current previous");
    $(this).find("a").addClass("current");
    $(this).prev().find("a").addClass("previous");
  });

})

＆＃13;

.current::after{
  content: " - current";
  color: blue;
}
.previous::after{
  content: " - previous";
  color: green;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h4>Click on each item</h4>
<ul id="pagin">
  <li><a class="pagination">&lt;</a></li>
  <li><a class="pagination">1</a></li>
  <li><a class="pagination previous">2</a></li> 
  <li><a class="pagination current">3</a></li>
  <li><a class="pagination">4</a></li>
  <li><a class="pagination">5</a></li>
  <li><a class="pagination">6</a></li>
</ul>

＆＃13;

Answer 4

var previousLink = $("ul#pagin li a.current").closest('li').prev().find('a.pagination');

if(previousLink){
  //do something
}else{
  //do something else
}

最接近是一种更好的方法，因为即使你用一些包装来包装锚标签（a）来进行样式化，最接近的仍然可以找到LI标签。

最接近于当前元素并沿DOM树向上移动直到找到所提供选择器的匹配。

Jquery：从列表中具有特定类的元素中查找前一个元素

4 个答案: