SOURCE

var snapshots=[];                                    　　　　　　　　 //快照集合
var timer=null;                                        　　　　　　　 //定时                        
var arr=[50,21,5,89,13,35,69,44,60,15,51,80,55,71];                 //排序数组
/*冒泡排序*/
function bubbleSort(arr){
    if(arr.length<=1){
        return arr;
    };
    var temp=0;
    for(var i=0; i<arr.length; i++){
        for(var j=0; j<arr.length-i-1; j++){
            if(arr[j]>arr[j+1]){
                temp=arr[j];
                arr[j]=arr[j+1];
                arr[j+1]=temp;
                snapshots.push(JSON.parse(JSON.stringify(arr)));    //<=记录下快照
            };
        };
    };
    return arr;
};
Array.prototype.bubbleSort=function(){
    return bubbleSort(this);
}
function painting(){
    var container=document.getElementById("container");
    var bars=[].slice.call( document.querySelectorAll(".bar") );           //将所有bar元素的集合转换为数组对象
    for(var i=0;i<arr.length;i++){
        if(bars.length!=arr.length){
            var bar=document.createElement("div");
            bar.className="bar";
            container.appendChild(bar);
        }else{
            break;                                　　　　　　　　　　　　　　 //当bar的数量等于数组的长度时，停止创建bar元素
        };
    };
    var snapshot=snapshots.shift() || [];                        　　　　　 //取出快照记录数组中的第一条记录
    console.log(snapshot);
    if(snapshot.length!=0){
        for(var i=0; i<bars.length; i++){
            bars[i].innerHTML=snapshot[i];
            bars[i].style.height=snapshot[i]*5+"px";
            bars[i].style.left=(i+1)*50+"px";
        };
    }else{
        clearInterval(timer);                            　　　　　　　　　　//绘制结束
        return;
    };
};

arr.bubbleSort();                                    　　　　　　　　　　　　//排序
timer=setInterval(painting,500);                                　　　　　 //定时绘制

<div id="container"></div>

#container {
  display: flex;
			justify-content: flex-start;
			align-items: flex-end;
}
.bar {
  width: 20px;
			margin-left: 10px;
			border: px solid #740A17;
			background-color: #CD6B6B;
}