Проверка наличия класса у элемента в JavaScript

Простое и эффективное решение – это использование метода .contains. Например:

test.classList.contains(testClass);

Этот метод позволяет проверить, содержит ли элемент указанный класс. Если класс присутствует, метод вернёт true, иначе – false. Это отличное решение для управления классами у элементов в DOM!

Ваше решение выглядит неплохо, и использование конструкции switch здесь вполне уместно. Вот простой код, который вы предоставили, на русском языке:

var test = document.getElementById("test");
var testClasses = test.className.split(" ");
test.innerHTML = "";
for(var i = 0; i < testClasses.length; i++) {
    switch(testClasses[i]) {
        case "class1": test.innerHTML += "У меня есть class1<br/>"; break;
        case "class2": test.innerHTML += "У меня есть class2<br/>"; break;
        case "class3": test.innerHTML += "У меня есть class3<br/>"; break;
        case "class4": test.innerHTML += "У меня есть class4<br/>"; break;
        default: test.innerHTML += "(неизвестный класс:" + testClasses[i] + ")<br/>";
    }
}

Это решение берет классы элемента с id "test", разбивает их на массив и затем проходит по каждому классу, добавляя соответствующее сообщение в innerHTML. Если класс не совпадает с одним из перечисленных, в выводе появится сообщение о неизвестном классе.

Если у вас есть вопросы или нужны уточнения по данному коду, не стесняйтесь спрашивать!

Вот фрагмент кода, который позволяет проверить, есть ли у элемента определённый класс, без использования jQuery.

function hasClass(element, className) {
    return element.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(element.className);
}

Этот код учитывает, что элемент может содержать несколько классов, разделённых пробелами.

ИЛИ

Вы также можете добавить эту функцию в прототип элемента, чтобы использовать её как метод:

Element.prototype.hasClass = function(className) {
    return this.className && new RegExp("(^|\\s)" + className + "(\\s|$)").test(this.className);
};

Затем вы можете вызывать этот метод так же, как и аналогичную функцию .hasClass() в jQuery:

document.getElementById('MyDiv').hasClass('active');

Это позволяет удобно проверять наличие классов у элементов в вашем проекте.

Вот упрощённый однострочник для проверки наличия имени класса у элемента по его ID:

function hasClassName(classname, id) {
 return String((document.getElementById(id) || {}).className).split(/\s/).indexOf(classname) >= 0;
}

Обратите внимание, что indexOf для массивов не поддерживается в Internet Explorer (конечно). В интернете можно найти множество полифиллов для этой функции.

Это код немного устарел, но, возможно, кому-то поможет моя реализация.

// Исправляем метод indexOf для массивов в IE
if (!Array.prototype.indexOf) {
    Array.prototype.indexOf = function (searchElement) {
        if (this == null) throw new TypeError();
        var t = Object(this);
        var len = t.length >>> 0;
        if (len === 0) return -1;
        var n = 0;
        if (arguments.length > 0) {
            n = Number(arguments[1]);
            if (n != n) n = 0;
            else if (n != 0 && n != Infinity && n != -Infinity) n = (n > 0 || -1) * Math.floor(Math.abs(n));
        }
        if (n >= len) return -1;
        var k = n >= 0 ? n : Math.max(len - Math.abs(n), 0);
        for (; k < len; k++) if (k in t && t[k] === searchElement) return k;
        return -1;
    }
}

// Добавляем поддержку метода hasClass
if (!Element.prototype.hasClass) {
    Element.prototype.hasClass = function (classname) {
        if (this == null) throw new TypeError();
        return this.className.split(' ').indexOf(classname) === -1 ? false : true;
    }
}

Первый блок кода добавляет поддержку метода indexOf для массивов в устаревших версиях Internet Explorer, которые не поддерживают этот метод. Второй блок кода добавляет метод hasClass, позволяющий проверять, имеется ли определённый класс у элемента. Эти улучшения могут значительно упростить работу с массивами и DOM-элементами. Надеюсь, это будет полезно!