Javascript 为什么要使用&x27；runFunc（“键盘”、“鼠标”）和“x27”；只换三门课

在这段代码中，我创建了一个函数

runFunc（previousClass，newClass）

，用于更改类，但通过单击按钮，只有三个类发生了更改。为什么我们要点击按钮三次来改变所有的类

<div class="parent_class" id="parent">
    <div class="keyboard">1</div>
    <div class="keyboard">2</div>
    <div class="keyboard">3</div>
    <div class="keyboard">4</div>
    <div class="keyboard">5</div>
    <div class="keyboard">6</div>
</div>

<br><br>

<button onclick="runFunc('keyboard', 'mouse')">Change Class</button>

<script>

var a;

function runFunc(previousClass, newClass) {
var i;

var a1 = typeof previousClass;
var a2 = typeof newClass;

if (a1 === "string" && a2 === "string") {
    var a = document.getElementsByClassName(previousClass);
    console.log(a);

    for ( i = 0; i < a.length; i++ ) {
        a[i].className = newClass;
    }

    var b = document.getElementsByClassName(newClass);
    console.log(b);
    console.log("\n\n")
}
}

</script>
</body>

1.
2.
3.
4.
5.
6.



换班
var a；
函数runFunc（previousClass，newClass）{
var i；
var a1=先前类别的类型；
var a2=新类别的类型；
如果（a1==“字符串”&&a2==“字符串”）{
var a=document.getElementsByClassName（以前的类）；
控制台日志（a）；
对于（i=0；i

这是因为当您在第一个元素中替换classname时，它会自动从列表中删除，因此“旧”的第二个元素现在变为第一个，但您的循环向前推进并跳过“旧”的第二个元素，依此类推。 因此，您只需在第一个元素中不断更改classname，直到列表为空：

var-a；
函数runFunc（previousClass，newClass）{
var i；
var a1=先前类别的类型；
var a2=新类别的类型；
如果（a1==“字符串”&&a2==“字符串”）{
var a=document.getElementsByClassName（以前的类）；
控制台日志（a）；
while（a.长度）
{
a[0].className=newClass；
}
var b=document.getElementsByClassName（newClass）；
控制台日志（b）；
console.log（“\n\n”）
}
}

1.
2.
3.
4.
5.
6.



更改类别