jquery递归更新元素类

Question

我需要一个div更新类的函数。我希望每个节点的等级都增加1。更好的使用本例的解释我的需求：

我有一些股利如下：

<div id="content"> 
    <div id="1" class="rank2"> 
    <div id="2" class="rank4"> 
     <div id="3" class="rank7"> 
     </div> 
    </div> 
    <div id="3" class="rank4"> 
    </div> 
    </div> 
    <div id="4" class="rank2"> 
    </div> 
    <div id="5" class="rank2"> 
    </div> 
</div> 

我想一个函数来更新每一个排名是这样的：

<div id="content"> 
    <div id="1" class="rank1"> 
    <div id="2" class="rank2"> 
     <div id="3" class="rank3"> 
     </div> 
    </div> 
    <div id="3" class="rank2"> 
    </div> 
    </div> 
    <div id="4" class="rank1"> 
    </div> 
    <div id="5" class="rank1"> 
    </div> 
</div> 

所以每div嵌套排名增加1。

我尝试远：

var rank = 1; 

function initRank() { 
    $.each($("#content").find($(".rank"+rank)), function() { 
    if (rank >= 2 && $(this).parents(".rank"+(rank-1).length <= 0)) { 
     $(this).removeClass("rank"+rank).addClass("rank"+(rank-1)); 
     rank--; 
     initRank(); 
    } 
    }) 
    rank++; 
    if (rank < 10) { 
    initRank(); 
    } else { 
    return; 
    } 
} 

而且Live Demo

Answer 1

如果你不怕递归的，这里是你的演示的修改版本： https://jsfiddle.net/qo8s7xzy/3/

我用正则表达式来检查现有的课程，如果您想使用双位数行列，您必须改进它

.replace(/rank\d/g, "rank"+rank) 

它可以与div之间的其他元素一起工作，这可能是也可能不是你想要的。