如何在没有jQuery的情况下在Javascript中添加和删除类 [英] How to add and remove classes in Javascript without jQuery

问题描述

我正在寻找一种快速安全的方法来在没有jQuery的情况下从html元素中添加和删除类。

它也应该在早期IE（IE8及以上版本）中工作。

I'm looking for a fast and secure way to add and remove classes from an html element without jQuery.
It also should be working in early IE (IE8 and up).

推荐答案

以下3个函数适用于不支持 classList 的浏览器：

The following 3 functions work in browsers which don't support classList:

function hasClass(el, className)
{
    if (el.classList)
        return el.classList.contains(className);
    return !!el.className.match(new RegExp('(\\s|^)' + className + '(\\s|$)'));
}

function addClass(el, className)
{
    if (el.classList)
        el.classList.add(className)
    else if (!hasClass(el, className))
        el.className += " " + className;
}

function removeClass(el, className)
{
    if (el.classList)
        el.classList.remove(className)
    else if (hasClass(el, className))
    {
        var reg = new RegExp('(\\s|^)' + className + '(\\s|$)');
        el.className = el.className.replace(reg, ' ');
    }
}

https://jaketrent.com/post/addremove-classes-raw-javascript/

这篇关于如何在没有jQuery的情况下在Javascript中添加和删除类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！