代码之家  ›  专栏  ›  技术社区  ›  Ali

如何使用jquery删除所有CSS类?

  •  715
  • Ali  · 技术社区  · 15 年前

    而不是单独打电话 $("#item").removeClass() 对于一个元素可能拥有的每个类,是否有一个可以调用的函数从给定的元素中删除所有CSS类?

    jquery和原始javascript都可以工作。

    13 回复  |  直到 6 年前
        1
  •  1396
  •   Esteban Küber    15 年前
    $("#item").removeClass();
    

    打电话 removeClass 如果没有参数,将删除该项的所有类。


    您也可以使用 对的 方法如上所述):

    $("#item").removeAttr('class');
    $("#item").attr('class', '');
    $('#item')[0].className = '';
    

    如果您没有jquery,那么这几乎是您唯一的选择:

    document.getElementById('item').className = '';
    
        2
  •  110
  •   da5id    15 年前

    等等,如果没有指定任何特定类,removeClass()是否默认为删除所有类?所以

    $("#item").removeClass();
    

    会自己做的…

        3
  •  13
  •   kangax    15 年前

    当然。

    $('#item')[0].className = '';
    // or
    document.getElementById('item').className = '';
    
        4
  •  13
  •   Isaac Waller    15 年前

    只需设置 className 实dom元素的属性 '' (没什么)。

    $('#item')[0].className = ''; // the real DOM element is at [0]
    

    编辑: 其他人说只要打电话 removeClass 工作-我在谷歌jquery操场上测试过: http://savedbythegoog.appspot.com/?id=ag5zYXZlZGJ5dGhlZ29vZ3ISCxIJU2F2ZWRDb2RlGIS61gEM …它起作用了。所以你也可以这样做:

    $("#item").removeClass();
    
        5
  •  9
  •   Yanni    12 年前

    最短方法

    $('#item').removeAttr('class').attr('class', '');
    
        6
  •  8
  •   Shawn Rebelo    10 年前

    呵呵,来找一个类似的答案。 然后它击中了我。

    删除特定类

    $('.class').removeClass('class');
    

    假设element has class=“class another class”

        7
  •  4
  •   Dave informer    8 年前
    $('#elm').removeAttr('class');
    

    “榆树”中不再出现课堂属性。

        8
  •  3
  •   Alessandro Foolish Ciak DAnton    7 年前

    你可以试一下

    $(document).ready(function() {
       $('body').find('#item').removeClass();
    });
    

    如果必须访问不带类名的元素,例如必须添加新类名,则可以执行以下操作:

    $(document).ready(function() {
       $('body').find('#item').removeClass().addClass('class-name');
    });
    

    我在我的项目中使用这个函数来删除和添加HTML生成器中的类。祝你好运。

        9
  •  2
  •   xgqfrms    7 年前

    我喜欢使用原生JS来做这个,信不信由你!

    1。

    // remove all items all class  
    const items = document.querySelectorAll('item');
    for (let i = 0; i < items.length; i++) {
        items[i].className = '';
    }
    

    2。

    // only remove all class of first item
    const item1 = document.querySelector('item');
    item1.className = '';
    

    jQuery方法

    1. $("#item").removeClass();

    2. $("#item").removeClass("class1 ... classn");

        10
  •  1
  •   Vincent    8 年前

    由于并非所有版本的jquery都是相同的,您可能会遇到与我相同的问题,这意味着调用$(“item”)。removeClass();实际上并不移除类。(可能是个虫子)

    更可靠的方法是简单地使用原始的javascript并完全删除class属性。

    document.getElementById("item").removeAttribute("class");
    
        11
  •  1
  •   x-rw    8 年前

    尝试用 removeClass

    例如 :

    var nameClass=document.getElementsByClassName("clase1");
    console.log("after", nameClass[0]);
    $(".clase1").removeClass();
    var nameClass=document.getElementsByClassName("clase1");
    console.log("before", nameClass[0]);
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="clase1">I am Div with class="clase1"</div>
        12
  •  0
  •   Gregory Bologna    6 年前

    让我们用这个例子。也许你想让你网站的用户知道某个字段是有效的,或者通过改变该字段的背景色来引起注意。如果用户点击Reset,那么您的代码应该只重置具有数据的字段,而不需要循环访问页面上的其他字段。

    此jquery筛选器将只删除类“highlightcriteria” 具有此类的输入或选择字段。

    $form.find('input,select').filter(function () {
        if((!!this.value) && (!!this.name)) {
            $("#"+this.id).removeClass("highlightCriteria");
        }
    });
    
        13
  •  -1
  •   Nezir    11 年前

    我也有类似的问题。在我的例子中,对禁用的元素应用了aspnetdisabled类和所有禁用的控件都有错误的颜色。所以,我使用jquery在我不需要的每一个元素/控件上删除了这个类,现在一切都正常并且看起来很好。

    这是我删除aspnetdisabled类的代码:

    $(document).ready(function () {
    
        $("span").removeClass("aspNetDisabled");
        $("select").removeClass("aspNetDisabled");
        $("input").removeClass("aspNetDisabled");
    
    });