jQuery children() - JavaScript

jQuery children() 方法是用于查询目标元素的所有子元素。该方法只会查找目标元素下一层级的子元素，不会查找其后代元素。

语法

$(selector).children(filter)

• selector：必需，要查找子元素的父元素选择器。
• filter：可选，指定一个 CSS 选择器来筛选子元素。

返回值

该方法返回一个包含所有子元素的 jQuery 对象。

示例

HTML 代码

<ul id="menu">
    <li>首页</li>
    <li>新闻
        <ul>
            <li>国内新闻</li>
            <li>国际新闻</li>
        </ul>
    </li>
    <li>体育
        <ul>
            <li>足球</li>
            <li>篮球</li>
        </ul>
    </li>
</ul>

JavaScript 代码

// 查询 id 为 menu 的 ul 元素下所有的 li 元素
var lis = $('#menu').children('li');

// 遍历 lis 并输出其内容
lis.each(function() {
  console.log($(this).text());
})

输出结果为：

首页
新闻
体育

注意事项

• children() 方法只会查询目标元素的直接子元素，不会查询其后代元素。如果需要查询它的后代元素，可以使用 find() 方法。
• children() 方法返回的是一个 jQuery 对象，需要使用 jQuery 的方法进行操作。如果需要转换成原始的 DOM 元素，可以使用 get() 或 [index] 方法获取指定位置的元素。