Question

我有一个名为common-end的父div类。

我有很多这个类的div，它的外观如下：

<div class="item question common-end">
    <label>label</label>
    <div>
       <textarea name="name1" id="text1" class="deep-item form-control input-lg" rows="3"></textarea>
    </div>
</div>

并非所有common-end div都具有此结构。可能有多层嵌套。

我唯一肯定会知道的是，common-end内的某个地方会有类deep-item的某些东西（在这种情况下它会在textarea上）。

我可以使用什么jQuery选择器在deep-item内找到common-end SOMEWHERE？

由于

Answer 1

正如RyanW所提到的，最简单的选择器类似于CSS选择器：

var $deepItems = $('.common-end .deep-item');

但是，我应该提一下，在这种情况下，jQuery的工作方式是从右向左搜索。因此，如果您在.deep-item个元素以外的元素中有.common-end个元素（或者只是只有很少的.common-end个元素），那么您应该给jQuery提供范围的机会（使其稍微快一点）：

var $deepItems = $('.deep-item', '.common-end')
// equivalent to:
var $deepItems = $('.common-end').find('.deep-item')

这允许jQuery简单地找到所有.common-end元素首先，然后开始搜索.deep-item（而不是找到所有.deep-item并确认它们＆＃ 39;重新嵌套在.common-end）。

这可能不是一个大问题，因为你有特定的类来搜索。但是，如果您从一个类开始并抓取特定标记，它可能会成为一个问题。请注意以下内容：

$('.common-end div');

哪个会抓取页面上的每个<div>，然后检查它是否是.common-end的祖先。

Answer 2

$('.common-end .deep-item')

这将返回公共端内的所有深层项目。如果您正在寻找特定的，您可以执行以下操作：

var el = $(<selector to the common-end i care about);
var deepItem = el.find('.deep-item');

Answer 3

在jQuery中，您使用选择器的方式与在css中使用它们的方式相同。

$('.common-end > .deep-item') //this will select only direct children
$('.common-end .deep-item') //this will select all children, even if nested under multiple levels

根据你的问题，你需要第二个。

jQuery搜索多个级别的孩子

3 个答案: