jquery选择具有类的父类的第一个子类

Question

为什么我如何只选择具有特定类的父类的特定类的第一个子元素clone()？

<div class="sector_order">

    <div class="line_item_wrapper">
    SELECT THIS DIV
    </div>

    <div class="line_item_wrapper">
    NOT THIS DIV
    </div>

</div>

我这样想:

var form1 = $(this)
    .parents('.sector_order')
    .children('.line_item_wrapper')
    .children().clone(true)

并使用类获取内部div line_item_wrapper,但是当我尝试使用此添加时,我得到一个空对象:

children('.line_item_wrapper :first')

谢谢!

Answer 1

您的问题是您的选择器在某些方面是错误的:

parents()返回一个,两个或多个与传递给方法的选择器匹配的元素; 限制自己使用第一个匹配的元素使用closest()(返回一个或没有与传入选择器匹配的元素).

你第一次使用该children()方法返回两个元素,因为它们都匹配提供的选择器并具有类line_item_wrapper; 你需要明确说明你想要哪两个,你可以使用:first选择器(或first()方法),或:first-child选择器.

对children()方法的第二次调用找到第一个元素的子元素,它们与选择器匹配,您似乎不想要它.

无论如何,如果你必须使用父(从相同的$(this)元素开始):

var form1 = $(this).closest('.sector_order').find('.line_item_wrapper:first').clone(true);

要么:

var form1 = $(this).closest('.sector_order').find('.line_item_wrapper').first().clone(true);

要么:

var form1 = $(this).closest('.sector_order').find('.line_item_wrapper:first-child').clone(true);

或者,坦率地说,一种更简单的方法(但这确实省去了父类名检查):

var form1 = $(this).prevAll('.line_item_wrapper:last');

要么:

var form1 = $(this).siblings('.line_item_wrapper').eq(0);

参考文献:

• closest().
• eq().
• find().
• :first.
• :first-child.
• first().
• :last.
• parents().
• prevAll().
• siblings().

Answer 2

你正在传递一个无效的选择器children().代替

.children('.line_item_wrapper :first')

尝试

.children('.line_item_wrapper').first()