使用$.each to addClass to elements

Question

我正在尝试使用数组设置锚点子集的样式

HTML和CSS：

<div>
    <a href="#1">one</a>
    <a href="#2">two</a>
    <a href="#3">three</a>
    <a href="#4">four</a>
    <a href="#5">five</a>
    <a href="#6">six</a>
    <a href="#7">seven</a>   
</div>

.hilight {
    background: #f00;
}

例如，我如何将“hilight”类添加到锚点2、5和6……

测试过后：

$("a[href='#5']").addClass('hilite');

我尝试使用$.each()执行以下操作，但不起作用。我想我在每个锚点上迭代了3次，但我没想到会没有输出！

var arr = ["#2", "#5", "#6"];   
$.each(arr, function(index, value) {
    $("a[href=value]").addClass('hilite');'
});

谁能给我指个方向:)

Answer 1

您的代码无法工作，因为$("a[href=value]")不存在。

您希望使用$("a[href='"+value+"']")，其中value将被变量value的值“替换”。

这里有个解决办法：

var arr = ["#2", "#5", "#6"];   
$.each(arr, function(index, value) {
    $("a[href='"+value+"']").addClass('hilite');
});

Answer 2

您根本不需要每个选择器，您可以只使用逗号分隔的所有选择器。

$("a[href='#2'], a[href='#5'], a[href='#6']").addClass('hilite');

Answer 3

如果你没有一大堆这样的东西，可能更简单的做法是...

$("a[href='#2'], a[href='#5'], a[href='#6']").addClass('hilite');

做同样的事情，但更动态地(对于John)...

var arr = ["#2", "#5", "#6"]; 
$("a[href='"+arr.join("'], a[href='")+"']").addClass('hilite');

这假设arr始终至少有一个元素。