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之間的其他元素一起工作，這可能是也可能不是你想要的。