Question

嗨，在下面的html中，jquery next和最近的选择器不起作用

 <div>
   <div class="class1" style=" background-color: red"> hi </div>
   <br>
   <div class="class2">Yes</div>
</div>

当我尝试alert ($(".class1").next(".class2").text())时，alert ($(".class1").closest(".class2").text())警告空白。我需要提醒是。

代码中的错误是什么。

Answer 1

class1和class2的div在dom中处于同一级别。所以你可以在class1的兄弟姐妹中查找并搜索class2。

$(".class1").siblings('.class2').text()
// => "Yes"

或者您可以使用两者的父元素来查找它下面的class2。

$(".class1").parent().find('.class2').text()
// => "Yes"

Answer 2

next只关注下一个直接的兄弟姐妹。你想要的是nextAll：

console.log($(".class1").nextAll(".class2").text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
   <div class="class1" style=" background-color: red"> hi </div>
   <br>
   <div class="class2">Yes</div>
</div>

Answer 3

<br>是.class2，不是类next()的元素。使用其他alert($(".class1").next().next(".class2").text());：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <div class="class1" style=" background-color: red">hi</div>
  <br>
  <div class="class2">Yes</div>
</div>

＆＃13;

<br>

＆＃13;

如果有多个nextAll()元素，您可以使用alert($(".class1").nextAll(".class2").text());：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <div class="class1" style=" background-color: red">hi</div>
  <br>
  <div class="class2">Yes</div>
</div>

＆＃13;

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/colorlightAccent">
<item android:drawable="@color/white"/>
</ripple>

＆＃13;

Answer 4

由于next()仅在兄弟之后立即定位，因此您的代码无效。

您可以.parent()然后使用.find() / .children()。

$(".class1").parent('div').find(".class2").text()

console.log($(".class1").parent('div').find(".class2").text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <div class="class1" style=" background-color: red">hi</div>
  <br>
  <div class="class2">Yes</div>
</div>

接下来，最近的选择器不工作Jquery

4 个答案: