Javascript jQuery将一直运行（通过sib、父级、grandPs等），直到找到元素的第一个实例

我正在尝试使用jQuery横切DOM以查找标记的第一个匹配项。我试过

最近的

，

上一次

，

上一次

，但在某些结构情况下都失败了。如果示例中的

p

标记从同级更改为父级或更高级别，则会失败。所以我总是把目标对准

p

标签。但是如果您删除小提琴中的

p

标记（

p标记1

）。。。我想

p标记测试2

突出显示。。。如果删除

p标签2

，我希望

p标签3

突出显示我正在寻找一种任意的方法来向上移动。一个不是基于选择器与sib、parent、grandP的位置关系，而是基于在所述选择器上方第一次找到p标记。

 <div>(great-great-grandparent)
  <div>div (great-grandparent)
    <p>p6</p>
    <div>ul (second ancestor - second grandparent)
      <p>p5</p>
      <div>ul (first ancestor - first grandparent)
        <p>p4</p>
        <div>Wrapper
          <!-- <span>span3</span> -->
          <div>li (direct parent)
            <!-- <p>p2-2</p> -->
            <!-- <p>p2</p> -->
            <label class='one'>label1</label>
            <p>p1</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

这是我得到的最接近的结果，但它只上升了1级，而没有向上搜索第一个

p

：

if ($(".one").prevAll("p:first").length == 0) {
  $(".one").closest(":not(.one)*").prevAll("p:first").css({
    "color": "red",
    "border": "2px solid red"
  });
} else {
  $(".one").prevAll("p:first").css({
    "color": "red",
    "border": "2px solid red"
  });
}

您可以使用parents（）。父对象向上遍历，直到它遇到传递的选择器

$("span").parents(".ancestors").find("p:first");

另一个选项是使用父对象和jQuery的第一个选择器（不是CSS）：

$（文档）.ready（（）=>{
$（“span”）.parents（“div”）.find（“p”）.first（）.css({
“颜色”：“红色”，
“边框”：“2倍纯红”
});
});
div，p，span*{
显示：块；
边框：2件纯色浅灰色；
颜色：浅灰色；
填充物：5px；
利润率：15px；
}

（曾祖父母）
分区（曾祖父母）
测试4
ul（第二祖先-第二祖父母）
测试3

ul（始祖-祖父母）
测试2

李（直接家长）
测试1

跨度
你到底想检索哪个元素？@RoryMcCrossan小提琴应该向你展示——一般来说。在找到所述元素（元素、类、id等）的第一个实例之前，问题真正向上跨越的是什么元素并不重要。小提琴手正确地选择了前面的
p
到
span
，但您声明这不是您想要的，因此请澄清。确切地说，您希望针对哪个元素？
问题实际上是在找到所述元素（元素、类、id等）的第一个实例之前进行的
，因此在本例中，您希望获得
test4
元素？@RoryMcCrossan。我正在尝试选择第一个p标记，无论它位于何处。因此，如果您将p标记移动到其当前的上一个位置，那么它应该高亮显示下一个p，并在测试期间每次删除选定的p时继续。在这种情况下，我建议将
closest（）
置于
parents（）
之上，但考虑到问题中的HTML，这应该是可行的。@imvain2。这不会像以前那样起作用。祖先并不是我想忽略的东西。@RookStrife在您更改了问题和代码后，我用一个工作示例更新了我的答案。出于测试目的，我将第一个P设置为B。@imvain2。问题是，这仍然不是武断的。家长并不总是一个div。
$("span").parents(".ancestors").find("p:first");