Question

关于jQuery的each()函数的快速问题;

当我使用each()时，通常是因为我想影响除一个元素之外的所有元素。例如：

$("a.aboutMenu").each(function () {
    $(this).css("color","#FFF");
});

$(this).css("color","#111");

有没有一种写作方式的简便方法？我知道我可以在if函数中添加each，但必须要写“each除$(this)”之外的其他内容吗？

Answer 1

在这种情况下，您甚至不需要each，但通常您可以使用this从选择器中排除not()，并在同一步骤中应用它的CSS：

$("a.aboutMenu").not($(this).css('color', '#111')).each(function() {
    $(this).css("color", "#FFF");
});

这是有效的，因为使用css()作为setter会返回原始的jQuery对象，该对象很适合作为not()的参数。

Answer 2

如果你在jQuery API上看到，那就完全一样了。

在您的示例中，您说：对于每个a.aboutMenu，将css颜色更改为白色。

你也可以写：

$.each('a.aboutMenu', function() { $(this).css("color","#FFF");} });

如果您需要控件，只需在函数内添加if。

编辑：

要删除this元素，您可以写：

$('.aboutMenu').not(this).css('color', '#FFF');

或更好：

$('.aboutMenu').not(this).addClass('whiteColor');

Answer 3

嗯，你可以做到以下几点：

$("a.aboutMenu").not( $(this) ).each(function () {
     $(this).css("color","#FFF");
});
$(this).css("color","#111");

Answer 4

您可以通过以下方式完成：

$("a.aboutMenu").css("color","#FFF");
$(this).css("color","#111");

Answer 5

作为典型.each()方法的替代方法，在某些情况下使用.siblings()会更好。特别是在您想要定位除一个特定元素之外的所有内容的情况下。

例如：

$('a.aboutMenu').on('click', function() {
  // the initiating element..
  this.css('color','#ddd');

  // all anchor siblings..
  this.siblings('a').css('color','#fff');

  // the initiating element and all '.menu' siblings..
  this.css('color','#ddd').siblings('a.menu').css('color','#fff');
});

当然，这是一个简单的例子，不能满足不会（或不应该）更新的元素，但关键是你可以从一个入口点（一个被点击的元素，当前活动）工作元素等。）然后对所有兄弟姐妹进行修改。

也许有点超出了这个问题的范围，但这甚至可以使用一些创意选择器命名来扩展。请注意，$('.menu-about')和$('[class=|"menu"]')都会匹配类菜单选择器，例如'menu-about'（有关详细信息，请参阅this），您可以创建一个小的，易于重复使用的样式更新功能几乎适用于任何菜单布局。

使用jQuery的每个（）影响all-but-one-elements

5 个答案: