javascript - 获取具有相同类前缀和/或相同后缀的元素包，然后更新此包

Question

让我们举个例子：

<div class="gg-1"></div> // 1
<div class="gg-1"></div> // 1
<div class="gg-1"></div> // 1

<div class="gg-3"></div> // 3
<div class="gg-3"></div> // 3

<div class="gg-5"></div> // 5
<div class="gg-5"></div> // 5

我如何更新这些 div 类以获得以下结果？

<div class="gg-1"></div> // 1
<div class="gg-1"></div> // 1
<div class="gg-1"></div> // 1

<div class="gg-2"></div> // 2
<div class="gg-2"></div> // 2

<div class="gg-3"></div> // 3
<div class="gg-3"></div> // 3

需要纯 Javascript（附加 JQuery）。

我下面的函数可以帮助您按类获取带有前缀的元素：

function scn$(container,selectorTag,prefix) {
    var items = [], myPosts = document.getElementById(container).getElementsByTagName(selectorTag);

    for (var i = 0; i < myPosts.length; i++) {
        // Omit Undefined Null Check
        if (myPosts[i].className.lastIndexOf(prefix,0) === 0) {
            items.push(myPosts[i]);
        }
    }
    return items;
}

所以现在我们可以通过 选择我们的元素scn$('container','div','gg-')。

下一步是什么？有什么想法/线索吗？

Answer 1

试试下面的方法，让我知道，

演示：http: //jsfiddle.net/pmc3g/

(function() {

    function scn$(container, selectorTag, prefix) {
        var items = [],
            myPosts = document.getElementById(container).getElementsByTagName(selectorTag);

        var prevClass = null, curVal = 0;
        for (var i = 0; i < myPosts.length; i++) {
            var curClass = myPosts[i].className;
            // Omit Undefined Null Check
            if (curClass.lastIndexOf(prefix, 0) === 0) {

                if (prevClass != curClass) {
                    prevClass = curClass;
                    curVal++;                   
                }

                myPosts[i].className = prefix + curVal;
                items.push(myPosts[i]);
                console.log(myPosts[i].className);
            }
        }
        return items;
    }

    scn$('container', 'div', 'gg-');

})();