堆棧內存溢出
  簡體   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