堆栈内存溢出
  繁体   English   中英

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

[英]jQuery: How to check if two elements have the same class

 原文  2012-03-07 14:59:52  4   6    javascript/ jquery/ html/ detection

问题描述

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

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

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

6 个解决方案

解决方案1
 5 已采纳  2012-03-07 15:08:04

我建议： 

$('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小提琴演示 。

编辑试图解释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');
            }
        }
    });

JS小提琴演示 。

编辑，因为它似乎我以前尝试，为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小提琴演示 。

参考文献：

解决方案2
 3  2012-03-07 15:03:17

好吧，假设我理解正确，你可以这样做...... 

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
});

解决方案3
 1  2012-03-07 15:02:09

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

解决方案4
 0  2012-03-07 15:01:57

使用jquery hasClass（）方法将引导您找到解决方案

解决方案5
 0  2012-03-07 15:02:28

这是一个建议，可能还有其他（更好）:) 

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

解决方案6
 0  2012-03-07 15:04:41

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; 
    }
});

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 jQuery-检查数组中的2个元素是否具有相同的类 jQuery - 如何检查两个元素是否相同？ 如何检查两个数组中的两个元素是否具有相同的索引？ 如何遍历 class 名称，因此如果两个或多个元素具有相同的数据属性，则它们可以使用 jQuery 具有相同的 ID 有没有办法检查两个数组是否具有相同的元素？ js-检查相同的类元素是否具有id 如何使用jquery检查多个元素是否具有相同的类？ 如何检查两个jQuery选择器是否选择了相同的元素 如何检查两个类实例是否具有相同的值 如何使用 Javascript 检查具有相同 class 名称的所有元素是否都具有相同的样式属性
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM