Question

这是我的HTML代码。

<div data-value="1">

    <div data-items="bind">
        <div data-item="Black" />
        <div data-item="Orange" />
    </div>

    <div data-types="bind">
        <div data-type="Books" />
        <div data-type="Mobiles" />
    </div>

    <button>button 1</button>
    <input type='text'/>

</div>

<div data-value="2">

    <div data-items="bind">
        <div data-item="Black" />
        <div data-item="Orange" />
    </div>

    <div data-types="bind">
        <div data-type="Gifts" />
        <div data-type="Cards" />
    </div>

    <button>button 1</button>

</div>

我有两个包含数据值“1”和“2”的父div。

第一

我想要div的子项包含 data-value =“1”。输出应该是4个孩子2个div，1个按钮，1个输入

第二

我希望div的子项包含 data-value =“2”。输出应该是3个孩子2个div，1个按钮

如何使用jQuery来实现。

Answer 1

直接后裔选择器

$("div[data-value='1'] > *");

或children方法：

$("div[data-value='1']").children();

根据需要重复。

Answer 2

您可以使用.children()

获取子元素

$('div[data-value="1"]').children();

<强>来源（S）

jQuery API - .children()

Answer 3

$("div[data-value='1']").children();

jsFiddle Demo

Answer 4

使用jQuery .children()功能，并结合attribute equals selector：

var $children1 = $('[data-value="1"]').children(); // children of element with data-value equal to 1

var $children2 = $('[data-value="2"]').children(); // children of element with data-value equal to 2

如何选择子元素但只有一个级别

4 个答案: