Question

在jQuery空间中表示AND条件“，”表示OR条件，是吗？但我正面临着一些问题。这是我的示例HTML代码

<td id="4">
    <div id="test1" class="test1"></div>
    <div id="test2" class="test2"></div>
</td>
<td id="5">
    <div id="test1" class="test1"></div>
    <div id="test2" class="test2"></div>
</td>

如果我使用以下查询，则可以使用

jQuery('#4 [id*=test1]')

它选择正确的div。但是，如果我使用此查询，

jQuery('#4 #test1')

它不起作用。任何的想法？

Answer 1

在同一文档中包含重复ID无效。

如果要动态构建它，请尝试将父ID添加到子项中，这样就像：

<td id="r4">
    <div id="r4_test1" class="test1"></div>
    <div id="r4_test2" class="test2"></div>
</td>
<td id="r5">
    <div id="r5_test1" class="test1"></div>
    <div id="r5_test2" class="test2"></div>
</td>

请注意，使用数字启动ID也无效，因此我冒昧地将“r”添加到您的行ID中。

我建议使用选择器：

$('#r5 .test1')

Answer 2

空间并非严格意义上的“和”条件。在你自己的例子中，jQuery('#4 #test1')空间意味着如果你明白我的意思就让＃4的孩子称为＃test1

jquery docs对此的解释比我做得好！

jQuery（'祖先后裔'）选择作为给定祖先后代的所有元素。

Answer 3

根据“AND”和“OR”来选择选择器可能不是最有用的方法。如果一个空格实际上意味着“AND”，那么这两个陈述将是相同的：

$('.parent_class .child_class')

$('.child_class .parent_class')

如果选择器是一个简单的“AND”，那么这些语句将选择符合这两个标准的所有项目。

实际上，这些陈述非常不同。 jQuery和CSS选择器中的空格实际上显示了继承。当你有两个单独的类时，就像在我的例子中一样，你总是说“选择列表中第二个的类，只有当列表中包含第一个类的元素包含它时。”

你可以说逗号的意思是“或”，但实际上它只是将两个选择语句相互分开，这样你就可以选择两个完全独立的项目或项目组。

jQuery选择器语法借鉴了CSS，因此this group of tutorials on w3schools.com可能是一个有用的起点。

Answer 4

我认为你应该从div标签中删除id并只使用类。

use $('#d5 .test1') or
$('#d5').find('.test1')

我通常使用后者，因为当我一个月后回去查看代码时，它更容易阅读。

<td id="d4">
  <div class="test1">w</div>
  <div class="test2">x</div>
</td>
<td id="d5">
  <div class="test1">y</div>
  <div class="test2">z</div>
</td>

和/或jQuery中的条件

4 个答案: