首页 > 解决方案 > 使用 javascript 更改数组元素中的颜色

问题描述

我是 JavaScript 新手。我正在对可视化进行排序,我想一一更改数组元素的颜色。我试图这样做,但它们都同时改变了 布局

    function selectionSort(main_arr)
{
    var arr_slots = document.getElementById("draw-area").childNodes;
    for (var i=0; i<main_arr.length; i++)
    {
    arr_slots[i].style.backgroundColor="red";
       (function(index)
       {
           setTimeout(function()
           {
               arr_slots[index].style.backgroundColor="#f2f2f2";
           },1000);
       })(i)
       

    }
}

标签: javascriptcsssortingstyles

解决方案


setTimeout 开始一个异步进程,在该进程中等待然后触发其回调。您的循环几乎立即迭代所有元素。您需要重新编写代码,以便下一个元素的颜色更改计时器由先前的颜色更改触发。


推荐阅读