jQuery:是否有可能从元素中选择只有一个类的元素,最多可能有3个类?

Jos*_* C. 19 javascript jquery jquery-selectors

例如,假设我有以下内容:

<span class="a b c">Has class a, b, and c</span>  
<span class="a">Has class a</span>  
<span class="b c">Has class b and c</span> 
<span class="a c">Has class a and c</span> 
<span class="a c">Has class a and c</span> 
<span class="a">Has class a</span>
Run Code Online (Sandbox Code Playgroud)

现在,假设我想选择只有 a类的所有元素.
意思是只选择第二个和最后一个span.
有一个简单的方法吗?

max*_*son 34

$('.a').not('.b, .c')
Run Code Online (Sandbox Code Playgroud)

这将选择所有a没有b或没有类的元素c.然而,他们仍然可以上课d,e等等.如果你真的只想要除了以外没有类的元素,请使用Phil的答案a.


Mer*_*ham 9

(请参阅下文,了解为什么您可能不想完全按照问题提出的要求)

您可以使用[class="a"]"属性等于选择器",虽然它很脆弱:

$('span[class="a"]').hide();
Run Code Online (Sandbox Code Playgroud)

问题是,如果你的类属性中有任何空格,那么它将会中断.看到这个小提琴:http://jsfiddle.net/c7DP7/

你可以通过使用普通类选择器对这些项进行基本查询来解决这个问题,然后在仅a设置检查时进一步过滤它们(并在第二个过滤器中修剪空白).看到这个小提琴:http://jsfiddle.net/uD48E/1/

$('.a')
    .filter(function(index){
        return $(this).attr("class").trim() == "a";
    })
    .hide();
Run Code Online (Sandbox Code Playgroud)

问题似乎是试图制作更多"面向未来"的代码,但这种具体方法更加脆弱.拒绝所有与您正在过滤的当前类a无关的类可能会因与类无关的原因而破坏事物(如不相关的类de稍后添加的类).如果您将应用jQuery的HTML将来可能会更改,这一点很重要.

更好的方法是过滤掉影响类含义的类a.允许这种灵活性实际上使您的代码更具有前瞻性.请参阅maxedison的答案,了解最佳方法.


Phi*_*ein 5

我想如果你想这样做,你可以简单地做:

var spans = $("span[class='a']");
Run Code Online (Sandbox Code Playgroud)

  • OP 的简要说明:您不必像 Phil 在这里那样在选择器中包含单词 `span`。如果有可能具有所需类的 div 或 imgs 并且您想选择它们,`$("[class='a']")` 会这样做。 (3认同)