jquery - 使用jquery向后遍历

Question

我有如下代码

如果我单击“finallink”类，我想选择或显示与“level_”类匹配的所有先前元素，直到“父”类。有很多“级别”类，例如“level_1，level_2 ... level_n。

​</p>

<div class="parent">
    <a href="#" class="level_0">level 0 text</a>

    <div class="someclass">1</div>
    <div class="someclass">2</div>
    <div class="someclass">3</div>
    <div class="someclass">4</div>

    <h1 class="level_1">level 1 text</h1>

    <div class="someclass">1</div>
    <div class="someclass">2</div>
    <div class="someclass">3</div>
    <div class="someclass">4</div>

    <h2 class="level_2">level 2 text</h2>

    <a href="#" class="finallink">link</a>
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

我尝试过这样的事情

$(".finallink").closest("h3").prevAll("level_1").css("background-color","yellow");

如何获得所有“level_”值。示例代码jsfiddle

Answer 1

如果标记类似于问题，其中finallink是最后一个元素，或者至少_level在同一个父级中没有任何具有其下类的元素，您可以首先获取与该类匹配的最接近的父.parent级，然后find()是所有匹配的元素_level班级：

$(".finallink").closest(".parent")
               .find("[class^='level_']")
               .css("background-color","yellow");

否则，你可以这样做：

$(".finallink").prevAll()
               .filter("[class^='level_']")
               .css("background-color","yellow");​

Answer 2

您已经说过“以前的”级别，我指的是链接之前的级别。您已经说过“直到parent类”，因为那是容器，这意味着我们可以使用所有以前的兄弟姐妹，然后过滤到仅具有其中一个level_x类的兄弟姐妹：

$(".finallink").click(function() {
    var list = $(this).prevAll().filter(function() {
        return this.className.match(/\blevel_/);
    });

    // Use `list`
});

实例| 来源

即使您最终level_1在<h2 class="something level_1" ...>.