window.onload=function(){ waterfall('main','box');}//將main下的所有class為box的元素取出來function waterfall(parent,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); console.log(cols); oParent.style.cssText='width:'+oBoxW*cols+'px;margin:0 auto'; var hArr=[];//存放每一列高的數組 for(var i=0;i<oBoxs.length;i++){//遍歷所有class為oBoxs的元素 if(i<cols){ hArr.push(oBoxs[i].offsetHeight); } } console.log(hArr);}//根據class獲取元素function getByClass(parent,clsName){ var boxArr=new Array(), ? oElements=parent.getElementsByTagName('*'); for(var i=0;i<oElements.length;i++){ boxArr.push(oElements[i]); } return boxArr;}function getMinIndex(arr,val){ for(var i in arr){ if(arr[i]==val){ return i; } }}