javascript - 用jquery比较各种类名

Question

我有多种 div 类名:

 box blue full

 box blue border purple

 box purple full

 box white purple border

 box purple border

 box purple full

 box blue border

 box white

 box white purple border

每一行都是一个单独的 div 及其特定的类名。除了蓝色、紫色和白色之外，还可能有红色和绿色。

我想做的是:我正在循环遍历每个 div，并且我想检查以确保该 div 的类名称不超过 1 个颜色(白色和其他颜色除外)

例如，“box blue border Purple”就不行，我需要将其更改为“box White”的类名

所以基本上，任何有两种颜色的 div 都需要更改为白色框

如果你想看一个例子，我正在研究这个:http://k.p2digital.net/如果您单击红色框，然后单击左侧顶部第三列中的框，您刚刚创建的红色框左侧的框就会变成红色......但因为它位于另一个纯色框之间，那不是它自己的颜色，它应该变成白色。

我有一个循环，在单击“运行”后，我将在此处检查以确保没有具有两种不同颜色的框(意味着该框位于两个纯色框之间)并且需要更改变白

 for(var i = 0; i < 36; i++){
        console.log($(".box[rel='"+[i]+"']").attr('class'));    
        class = $(".box[rel='"+[i]+"']").attr('class');



    }

Answer 1

用这个

colArr=new Array('red','blue',...);
$('div.box').each(function(){
    var i,index;
    i=0;
    for(index in colArr){
        if($(this).hasClass(colArr[index])){
            i+=1;
        }
    }
    if(i>1){
        for(index in colArr){
            if($(this).hasClass(colArr[index])){
                $(this).removeClass(colArr[index]);
            }
        }
        $(this).addClass('white');
    }
});