jQuery: проверить наличие нескольких классов у элемента

Вопрос

Я знаю, что в jQuery есть функция hasClass(), которая используется для того, чтобы проверить, есть ли у элемента заданный класс. На одной странице логика моего JavaScript допускает, что у одного элемента может быть много классов, например, 5 или больше. Мне необходимо писать много условий, которые будут проверять наличие нескольких классов. Сейчас я делаю так:

if($('#myElement').hasClass("classOne") && $('myElement').hasClass("classTwo")) {
    // ...
}

Но такие конструкции кажутся мне избыточными и плохо читаемыми. Хотелось бы работать с чем-то на подобии:

if($('#myElement').hasClass("classOne", "classTwo")) {
    // ...
}

Но это, увы, не работает. Какие будут советы?

Ответ №1

В том случае, если Вам необходимо выполнить действие при условии, что в элемента есть несколько классов сразу (то есть условие И, а не ИЛИ), можно пойти следующим путём:

if($('#myElement').is('.classOne, .classTwo')) {
    // ...
}

Код получается короче. Но имейте ввиду, что работает немного медленнее, чем вариант, который Вы использовали раньше.

А как же быть, если необходимо использовать условие ИЛИ? Вот функция, которая вернёт true в случае, если у элемента есть хотя бы один из классов:

            $.fn.extend({
                hasClasses: function (arr) {
                    s = this;
                    for (i in arr) {
                        if ($(s).hasClass(arr[i]))
                            return true;
                    }
                    return false;
                }
            });

Использовать так:

if($('#myElement').hasClasses(['classOne', 'classTwo', 'classThree'])) {
   // ...
};

2 комментария

  • steve:

    function getCurrentClass(find_class, selector){

    var list = $(selector).get(0).classList;
    for(var i = 0;i < list.length;i++){
    if(find_class == list.item(i)){
    return true;
    }
    }

    return false;

    }
    // calling our function
    getCurrentClass("ui-accordion", "div#accor");

  • MichlAffonia:

    Дома есть интернет, продайте часть своего трафика и получи деньги через 15 — 20 мин!Подробнее….

Добавить комментарий


(обязательно)