Показать классы, которые существуют в строке числа

Question

У меня есть эта строка чисел var array = 1,6,2,9,5, полученная из API, поэтому я действительно могу изменить ее.

, и у меня есть это в моем html:

<div class="1 btn">Foo 1</div>
<div class="2 btn">Foo 2</div>
<div class="3 btn">Foo 3</div>
<div class="4 btn">Foo 4</div>
<div class="5 btn">Foo 5</div>
<div class="6 btn">Foo 6</div>
<div class="7 btn">Foo 7</div>
<div class="8 btn">Foo 8</div>
<div class="9 btn">Foo 9</div>

Я хочу добавить к любому классу, который существует в массив, класс 'foo'.Таким образом, в моем примере 1,6,6,9,5 от div получат класс 'foo'.

Как мне этого добиться?

Answer 1

Быстрый способ:

$('.' + array.join(', .')).addClass('foo');

изменить & mdash; если "массив" на самом деле является строкой:

$('.' + array.split(',').join(', .')).addClass('foo');

Answer 2

Вы можете воспользоваться тем фактом, что jQuery позволит вам несколько селекторов, разделенных запятыми, что довольно близко к тому, что у вас уже есть:

Если array действительно массив:

$("." + array.join(", .")).addClass("foo");

Если это строка (например, "1,2,3") вместо:

$("." + array.replace(/,/g, ", .")).addClass("foo");

Answer 3

Это должно работать.Обратите внимание, что я использую jQuery в этом коде

var yourArray = [1,6,2,9,5];
var elements = $('div');

for(var i=0; i<yourArray.length; i++){
    $(elements[yourArray[i]-1]).addClass('foo');
}

Answer 4

Вы используете недопустимые имена для своих классов CSS.

Имя может содержать символы az, AZ, цифры 0-9, точку, дефис, экранированные символы, символы Unicode 161-255, а также любые символы Unicode в виде числового кода, однако они не могут начинаться с тире или цифра.

См. http://www.w3.org/TR/CSS2/syndata.html#characters, Какие символы допустимы в именах / селекторах классов CSS? и Допустимые символы для идентификаторов CSS .

Answer 5

Использование ES5 .some: http://jsfiddle.net/rkknp/1/.

var array = [1, 6, 2, 9, 5];

// filter elements that have a class apparent in the array
$(".btn").filter(function() {
    return array.some( $.fn.hasClass.bind( $(this) ) );
}).addClass("red");​

Answer 6

Попробуйте это:

for (var i=0; i<array.length; i++)
{
    $('.' + array[i]).addClass('foo');
}