jQuery：如何检查两个元素是否具有相同的类

有没有办法检查两个元素是否具有相同的类名？我的代码看起来像这样...jQuery：如何检查两个元素是否具有相同的类

<body class="foo bar cats"> 
<a href="#" class="foo">Link</a> 
<a href="#" class="puppies">Link</a>

我想要做的就是添加另一个类的foo链接，如果它在体内的类相匹配。我如何检查我的链接中的一个类是否与jQuery中的一个类匹配？

来源

2012-03-07 Dustin

重复：http://stackoverflow.com/questions/1227286/get-class-list-for-element-with-jquery – Peter 2012-03-07 15:01:42

if（$（'selector'）。hasClass（'foo'））警觉（'我有班级foo，wohoo'）; – ggzone 2012-03-07 15:02:05

你应该使用[.hasClass（）]（http://api.jquery.com/hasClass/） – phemios 2012-03-07 15:01:58

我建议：

$('a').each(
    function() { 
     var classes = this.classList; 
     for (var i=0,len=classes.length; i<len; i++){ 
      if ($('body').hasClass(classes[i])){ 
       $(this).addClass('bodySharesClass'); 
      } 
     } 
    });

JS Fiddle demo。

编辑，试图占Internet Explorer的无法理解/使用/执行.classList：

if (!document.createElement().classList){ 
    var useAttr = true; 
} 

$('a').each(
    function(i) { 
     var classes = []; 
     if (!useAttr){    
      classes = this.classList; 
     } 
     else { 
      classes = $(this).attr('class'); 
     } 
     for (var i=0,len=classes.length; i<len; i++){ 
      if ($('body').hasClass(classes[i])){ 
       $(this).addClass('bodySharesClass'); 
      } 
     } 
    });

。

编辑，因为它出现在我以前的尝试，考虑到IE，失败了。叹。仍然！这种方法应该工作，虽然我无法测试它，因为我没有这两个IE 和的Windows：

$('a').each(
    function(i) { 
     var classes = this.className.split(/\s+/); 
     for (var i=0,len=classes.length; i<len; i++){ 
      if ($('body').hasClass(classes[i])){ 
       $(this).addClass('bodySharesClass'); 
      } 
     } 
    });

JS Fiddle demo。

参考文献：

classList。
hasClass()。

来源

2012-03-07 15:08:04

这看起来不错..打算给这个镜头！ – Dustin 2012-03-07 15:15:12

*请确认*！ =） – 2012-03-07 15:15:39

是的..这完美的作品！谢谢！！ – Dustin 2012-03-07 15:28:58

使用jQuery hasClass（）方法将带你到一个解决方案

来源

2012-03-07 15:01:57 Th0rndike

$('a').hasClass('foo').addClass('whatever');

来源

2012-03-07 15:02:09 aki

这里有一个建议，有可能是其他人（即更好）以及:)

$(document).ready(function() { 
    var $foo = $('.foo'); // select the foo link 
    if ($(body).hasClass($foo.attr('class'))) { 
     $foo.addClass('anotherClass'); 
    } 
});

来源

2012-03-07 15:02:28 Christoffer

OK，假设我正确地理解了你，你可以做这样的事情...

var link = $(".foo");//or select your link another way 
var linkClass = link.attr("class"); 
if($("body").hasClass(linkClass)){ 
    //link has matching class 
    link.addClass("newClass"); 
}

正如你所看到的我已经使用了hasClass() JQuery函数检查body标签是否有匹配的类。

如果您的链路是否将可能有一个以上的类的名字，你可以做这样的......

var link = $(".foo");//or select your link another way 
var linkClass = link.attr("class"); 
var classList = linkClass.split(/\s+/); 

var matchFound = false; 

for(var i = 0; i < classList.length; i++){ 
    if($("body").hasClass(classList[i])){ 
     //link has matching class 
     matchFound = true; 
    } 
} 

if(matchFound){ 
    link.addClass("newClass"); 
}

另外，如果你要处理的同时你的所有链接时间，你可以把它包装都在一个JQuery each()和改变，像这样的第一行...

$("a").each(function(index){ 
    var link = $(this); 

    //the rest of the above code here 
});

来源

2012-03-07 15:03:17 musefan

链接有多个类怎么办？ – xdazz 2012-03-07 15:10:05

@xdazz：显然你并没有阅读链接文档的这一部分：“如果类被分配给一个元素，那么.hasClass（）方法将返回true，即使其他类也是。” – Piskvor 2012-03-07 15:14:21

@xdazz：它成为一个不同的问题。 html/javascript可以改变这么多，试图迎合“如果是”，这是毫无意义的。总是更好地按照当前的要求进行编码，并尽可能保持javascript的清洁 – musefan 2012-03-07 15:15:37

var body_classes =$('body').attr('class').split(/\s+/); 
var foo_link = $('a.foo'); 
$.each(body_classes, function(index, item){ 
    if (foo_link.hasClass(item)) { 
     foo_link.addClass('class_you_want_to_add'); 
     return false; 
    } 
});

来源

2012-03-07 15:04:41 xdazz

jQuery：如何检查两个元素是否具有相同的类

回答

相关问题