Question

我需要选择包含多个类的所有元素。类名无关紧要，我只需要选择两个或更多的元素。

jQuery选择器会是什么样的？

Answer 1

这应该选择具有两个以上类的所有元素。

$('*').filter(function() {
  return this.className.trim().split(/\s+/).length > 1;
}).foo('bar');

Answer 2

$('[class*=" "]')

返回class属性中带空格的所有标记。

Answer 3

不同的理解使我找到了更好的解决方案（我为得出结论而道歉）：

<强> Demo

(function($){
    $.expr[':'].classes = function(o,i,m,s){
        var c = o.className.match(/\s*(.*)\s*/)[0].split(/\s+/).length;

        // Hard [fixed] limit
        // :classes(N)
        if (/^\d+$/.test(m[3])) {
            var n = parseInt(m[3], 10);
            return o.className.split(/\s+/).length == n;
        }

        // Expression:
        // :classes(>N)    :classes(>=N)
        // :classes(>N)    :classes(<=N)
        else if (/^[<>]=?\d+$/.test(m[3])) {
            var e = m[3].match(/^[><]=?/)[0],
                n = m[3].match(/\d+$/)[0];
            switch (e){
                case '<':
                    return c < n;
                case '<=':
                    return c <= n;
                case '>':
                    return c > n;
                case '>=':
                    return c >= n;
            }
        }

        // Range
        // :classes(4-6)
        else if (/^\d+\-\d+$/.test(m[3])) {
            var ln = parseInt(m[3].match(/^(\d+)/)[0], 10),
                hn = parseInt(m[3].match(/(\d+)$/)[0], 10);
            return ln <= c && c <= hn;
        }

        // all else fails
        return false;
    };
})(jQuery);

已更新为您提供的参数增加了更多灵活性。现在您有以下选项（用数字替换N＆amp; M）：

:classes(N)
查找具有N个类的元素
:classes(<=N)
查找具有N个或更少类的元素
:classes(<N)
查找少于N个类的元素
:classes(>=N)
查找具有N个或更多类的元素
:classes(>N)
查找超过N个类的元素
:classes(N-M)
查找类计数介于N和M之间的元素

Answer 4

以下代码将首先选择class属性中具有空格的所有元素。我们可以像Blender建议的那样做$（'*'），但效率较低，因为它最初选择页面上的所有元素，而不仅仅是那些可行的候选元素（即，在类名中有空格）。

它还考虑了只有一个类的情况，但是class属性中有一个空格（这是通过在分割之前在类属性上使用jQuery的$ .trim（）方法完成的）。 Blender并没有解决这种情况。

$(function(){
    var div = $('div[class*=" "]').filter(function(){
        var clsArray = $.trim(this.className.split(' ');
        return clsArray.length > 1;
    });
    div.css('background','yellow');
});

实例：http://jsfiddle.net/udBZy/3/

Answer 5

它就像普通的CSS一样工作

$('.class1.class2') // will select elements with both classes

jQuery选择具有多个类的元素

5 个答案: