如何在单个jQuery each循环中排除指定元素执行遍历

嘿，这个需求我之前也碰到过，给你几个实用的解决方案，看哪个更适合你的场景：

方法1：直接用选择器排除（推荐） #

最简洁高效的方式就是在初始选择器里就把不需要的元素排除掉，用CSS的:not()伪类结合后代选择器就行：

$.each($('.single-price .price:not(.special .price)'), function() {
  // 这里写你的遍历逻辑，已经自动排除了.special下的.price元素
  console.log($(this).text());
});

原理是:not(.special .price)会排除所有属于.special后代的.price元素，这样遍历的集合从一开始就不包含你要跳过的元素，性能也更好。

方法2：在遍历内部判断跳过 #

如果不想修改初始选择器，也可以在each循环里检查当前元素是否属于要排除的范围，通过closest()方法判断它是否有.special的父级：

$.each($('.single-price .price'), function() {
  // 判断当前元素是否在.special容器内，如果是就跳过
  if ($(this).closest('.special').length > 0) {
    return; // 跳过当前循环，继续下一个元素
  }
  // 这里写你的正常逻辑
  console.log($(this).text());
});

closest('.special')会向上查找最近的.special祖先元素，如果找到（length>0），就说明这个元素是要排除的，直接return跳过即可。

方法3：用filter先过滤再遍历 #

另一种思路是先用filter()方法把要排除的元素从集合中移除，再进行遍历：

$('.single-price .price')
  .filter(function() {
    // 返回true的元素会被保留，这里排除有.special祖先的元素
    return !$(this).closest('.special').length;
  })
  .each(function() {
    // 你的遍历逻辑
    console.log($(this).text());
  });

这种方式和方法1类似，但更灵活，如果后续有更多复杂的过滤条件，用filter会更容易扩展。

如果你的HTML结构里，.special是直接包含.price的父级，也可以把选择器写成$('.single-price .price').not('.special > .price')，这样更精准，不过上面的几种方法已经足够覆盖大多数场景啦～

内容的提问来源于stack exchange，提问作者Ketan Borada