jquery遍历元素方式
jQuery遍历元素方法
jQuery提供了多种方法来遍历DOM元素,以下是常用的遍历方式:
each()方法
使用each()方法可以遍历jQuery对象中的每个元素,并对每个元素执行回调函数:
$('selector').each(function(index, element) {
// index为当前元素的索引
// element为当前DOM元素
console.log(index, element);
});
find()方法
find()方法用于查找匹配选择器的后代元素:
$('parentSelector').find('childSelector').css('color', 'red');
children()方法
children()方法仅查找直接子元素:
$('parentSelector').children().addClass('highlight');
parent()和parents()方法
parent()获取直接父元素,parents()获取所有祖先元素:
$('childSelector').parent().css('border', '1px solid black');
$('childSelector').parents('div').addClass('ancestor');
siblings()方法
siblings()方法查找所有兄弟元素:
$('targetElement').siblings().hide();
next()和prev()方法
next()获取下一个兄弟元素,prev()获取上一个兄弟元素:
$('currentElement').next().addClass('next-sibling');
$('currentElement').prev().removeClass('prev-sibling');
filter()方法
filter()方法用于筛选匹配的元素集合:
$('div').filter('.active').css('background', 'yellow');
map()方法
map()方法通过函数处理每个元素并返回新的jQuery对象:
var texts = $('div').map(function() {
return $(this).text();
}).get();
closest()方法
closest()方法查找最近的匹配选择器的祖先元素:
$('childElement').closest('div.container').addClass('found');
add()方法
add()方法将元素添加到现有的jQuery对象中:
$('div').add('p').css('color', 'blue');
not()方法
not()方法从匹配的元素集合中移除指定的元素:
$('div').not('.exclude').hide();
has()方法
has()方法筛选出包含特定后代元素的元素:

$('div').has('p').css('border', '1px solid red');






