第12行 為什么我在setTimeout里面創(chuàng)建class為loading的div,不會(huì)跟著在后面顯示，而在最頂顯示？

window.onload=function(){

waterfall('main','box');

var dataInt={"data":[{"src":"24.jpg"},{"src":"25.jpg"},{"src":"26.jpg"},{"src":"27.jpg"},{"src":"28.jpg"}]}

window.onscroll=function(){

if(checkScrollSlide()){

var oParent=document.getElementById('main');

var oBoxs=getByClass(oParent,'box');

setTimeout(function(){

var oLoading=document.createElement('div');

oLoading.innerHTML='Loading';

oLoading.style.width="100%";

oLoading.style.height="10px";

oLoading.style.background="red";

oLoading.style.position="absolute";

oParent.appendChild(oLoading);

},1000);

for(var i=0;i<dataInt.data.length;i++){

var oBox=document.createElement('div');

oBox.className='box';

oParent.appendChild(oBox);

var oPic=document.createElement('div');

oPic.className='pic';

oBox.appendChild(oPic);

oBoxs.push(oBox);

var oImg=document.createElement('img');

oImg.src="images/"+dataInt.data[i].src;

oPic.appendChild(oImg);

//將數(shù)據(jù)塊渲染到頁面的尾部

}

window.onscroll=null;

waterfall('main','box');

}

}

}

function waterfall(parent,box){

//將main下的所有class 為box 的元素取出來

var oParent=document.getElementById('main');

var oBoxs=getByClass(oParent,box);

//計(jì)算整個(gè)頁面顯示的列數(shù)（頁面寬/box寬度）

var oBoxW=oBoxs[0].offsetWidth;

var cols=Math.floor(document.documentElement.clientWidth/oBoxW);

//設(shè)置main的寬

oParent.style.cssText='width:'+oBoxW*cols+'px;'+'margin:0 auto;';

var hArr=[];

for(var i=0;i<oBoxs.length;i++){

if(i<cols){

hArr.push(oBoxs[i].offsetHeight)

}else{

var minH=Math.min.apply(null,hArr);

var index=getMinIndex(hArr,minH);

oBoxs[i].style.position='absolute';

oBoxs[i].style.top=minH+'px';

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

hArr[index]+=oBoxs[i].offsetHeight;

}

}

}

function getMinIndex(arr,val){

for(var i in arr){

if(arr[i]==val){

return i;

}

}

}

function getByClass(parent,cls){

var boxArr=[];

var oElements=parent.getElementsByTagName('*');

for(var i=0;i<oElements.length;i++)

{

if(oElements[i].className==cls){

boxArr.push(oElements[i]);

}

}

return boxArr;

}

//滾動(dòng)是否具備加載數(shù)據(jù)塊的條件

function checkScrollSlide(){

var oParent=document.getElementById('main');

var oBoxs=getByClass(oParent,'box');

var lastBoxH=Math.floor((oBoxs[oBoxs.length-1].offsetHeight)/2+oBoxs[oBoxs.length-1].offsetTop);

var scrollTop=document.body.scrollTop||document.documentElement.scrollTop;

var clientHeight=document.body.clientHeight||document.documentElement.clientHeight;

return (scrollTop+clientHeight>lastBoxH)?true:false;

}