oBoxs[i].style.left =oBoxW*index +'px' 这一行，在最少高度的那列，图片会偏左

oBoxs[i].style.left =oBoxW*index +'px';

没有于高度最少的那一列对齐

而我是使用另一种方法：oBoxs[i].style.left =oBoxs[index].offsetLeft+ 'px'，就避免了问题

请问为什么会出现这样的问题？

function waterfall(parent,box){
    //将main下的所有class为box的元素取出来
    var oParent = document.getElementById(parent);
    var oBoxs =getByClass(oParent,box);
    //计算整个页面显示的列数（页面宽/box的宽）
    var oBoxW = oBoxs[0].offsetWidth;
    var cols =Math.floor(document.documentElement.clientWidth/oBoxW);
    //设置maind的宽
    oParent.style.cssText = 'width:'+oBoxW*cols+'px;margin:0 auto';
    var ArrH=[];//存放每一列高度的数组
    for(var i =0;i<oBoxs.length;i++){
        if(i<cols){
            ArrH.push(oBoxs[i].offsetHeight)
            
        }else{
            var minH=Math.min.apply(null,ArrH);
            var index =getMinhIndex(ArrH,minH);
            oBoxs[i].style.position ='absolute';
            oBoxs[i].style.top =minH+'px';
            oBoxs[i].style.left =oBoxW*index +'px';
            //oBoxs[i].style.left =oBoxs[index].offsetLeft+ 'px';
            //ArrH[index] +=oBoxs[i].offsetHeight;
        }
    
    }
    console.log(ArrH);
}