jquery的遍历

jQuery遍历方法

jQuery提供了多种遍历DOM元素的方法，以下是一些常用的遍历技术：

each()方法 使用each()可以遍历匹配的元素集合，对每个元素执行回调函数。回调函数的参数为索引和当前元素。

$('li').each(function(index, element) {
  console.log(index + ': ' + $(element).text());
});

find()方法 在匹配元素的子代中查找符合选择器的元素。

$('ul').find('li').css('color', 'red');

children()方法 获取匹配元素集合中每个元素的直接子元素。

$('ul').children().css('background-color', 'yellow');

parent()和parents()方法 parent()获取匹配元素集合中每个元素的直接父元素，parents()获取所有祖先元素。

$('li').parent().css('border', '1px solid black');

siblings()方法 获取匹配元素集合中每个元素的所有兄弟元素。

$('li.active').siblings().css('color', 'blue');

next()和prev()方法 next()获取匹配元素集合中每个元素的下一个兄弟元素，prev()获取上一个兄弟元素。

$('li.active').next().css('font-weight', 'bold');

filter()方法 将匹配元素集合缩减为符合指定选择器或通过函数测试的元素。

$('li').filter(':even').css('background-color', '#eee');

map()方法 通过函数传递匹配元素集合中的每个元素，生成包含返回值的jQuery对象。

var values = $('input').map(function() {
  return $(this).val();
}).get();

closest()方法 从元素本身开始，在DOM树中向上遍历，获取第一个匹配选择器的祖先元素。

$('li').closest('ul').css('border', '1px solid red');