jquery 过滤

jQuery 过滤方法

jQuery 提供了多种过滤方法，用于从一组匹配的元素中筛选出特定的子集。以下是一些常用的过滤方法：

过滤方法

• filter()：根据选择器或函数过滤元素集合。
• not()：从元素集合中移除匹配的元素。
• has()：保留包含特定子元素的元素。
• eq()：选择指定索引位置的元素。
• first()：选择第一个元素。
• last()：选择最后一个元素。
• slice()：选择指定范围内的元素。

使用示例

filter() 方法

// 选择所有 div 元素中带有 class 'highlight' 的元素
$('div').filter('.highlight').css('background-color', 'yellow');

// 使用函数过滤
$('div').filter(function() {
  return $(this).text().length > 100;
}).css('font-weight', 'bold');

not() 方法

// 选择所有 div 元素，但不包括 class 'exclude' 的元素
$('div').not('.exclude').css('border', '1px solid red');

has() 方法

// 选择所有包含 span 子元素的 div 元素
$('div').has('span').css('color', 'blue');

eq() 方法

// 选择第三个 div 元素
$('div').eq(2).css('font-size', '20px');

first() 和 last() 方法

// 选择第一个 div 元素
$('div').first().css('background-color', 'green');

// 选择最后一个 div 元素
$('div').last().css('background-color', 'purple');

slice() 方法

// 选择第 2 到第 4 个 div 元素（索引从 0 开始）
$('div').slice(1, 4).css('text-decoration', 'underline');

链式调用

jQuery 的过滤方法可以链式调用，以便更灵活地筛选元素：

$('div')
  .filter('.important')
  .not('.exclude')
  .has('span')
  .css('color', 'red');

这些过滤方法可以结合使用，以实现复杂的元素筛选需求。