如何使用 jQuery 遍历 div 的子元素？

在网页开发中，经常需要操作 HTML 元素及其属性。而 jQuery 是一个非常流行的 JavaScript 库，能够简化我们的 DOM 操作。本文将介绍如何使用 jQuery 遍历 div 的子元素。

遍历子元素

在 jQuery 中，可以使用 children() 方法来获取指定元素的当前元素下所有子元素。该方法返回一个 jQuery 对象，因此可以继续调用其他 jQuery 方法来操作子元素。

$('#myDiv').children().each(function() {
  console.log($(this).text());
});

以上代码演示了如何使用 each() 方法遍历子元素，并输出它们的文本内容。在遍历过程中，this 代表当前子元素，可以使用 $() 创建 jQuery 对象。

筛选特定子元素

有时候，我们需要筛选出特定的子元素进行操作。可以使用 find() 方法来筛选符合条件的子元素。该方法接收一个选择器作为参数，返回一个包含所有匹配元素的 jQuery 对象。

$('#myDiv').find('.myClass').css('color', 'red');

以上代码演示了如何使用 find() 方法来筛选出所有 class 为 myClass 的子元素，并将它们的字体颜色设置为红色。

总结

使用 jQuery 遍历 div 的子元素非常简单，只需要调用 children() 方法或者 find() 方法即可。此外，通过这两个方法可以结合其他 jQuery 方法来实现更强大的功能，比如添加、移除、修改子元素等操作。