关于使用FOR，关于函数中DIV层的覆盖

1.用setTimeout代替for,提高页面体验

for(var i=0;i<50;i++){
     for(var j=0;j<100;j++){
            //do some thing
      }
}

 
在JS中使用如上代码，界面会出现类似线程阻塞一样的状态，
使用setTimeout代替for,改善页面体验,改成如下代码，

 

var myLRLindex=1;
function setLRL(){
	for(var j=1;j<100;j++){
		//do some thing
	}
	myLRLindex++;
	if(myLRLindex<50){
		setTimeout(setLRL,0);
	}
}

 

 

就好多了。当然，使用setTimeout所改变的资源，不能影响其他的与该段代码会同时运行的程序。

 

2.有些页面操作，处理时，不希望用户还能够点击页面，这时，可以用一个覆盖全屏的透明的div层来达到目的

 

创建div层的部分代码，

var div_wait = top.document.createElement('div');
div_wait.id='waitDiv_win'；
div_wait.style.cssText='position:absolute;left:0px;top:0px;width:100%;height:100%;z-index:1100;background-color: #000000; filter: alpha(opacity=30);';
div_wait.style.display='none';
top.document.body.appendChild(div_wait);

 使用中可能会出现一些问题，比如下面

 

function test1(){
	//1.层显示
	//2.一些耗时操作
	//3.层隐藏
}

  

 

可能会发现，这个覆盖全屏的div层，测试时还能显示，为什么这里就不出现了呢。

主要是放在一个函数中，那么在函数结束前，页面是不会刷新的。页面不刷新，则层显示还没有出来，层就被隐藏了。

如果你在其中加上alert();语句，就可以看到，实际运行过程中，层是显示过的。alert()语句会导致页面的刷新。

 

如果不使用alert(),该怎么办呢？

 

比较下面两个代码就可以了

 

1.需要alert()的

	var divTop=null;	

	function divAboveAll(){
		divTop = document.createElement('div');
		divTop.style.cssText='position:absolute;left:0px;top:0px;width:100%;height:100%;z-index:1100;background-color: #000000; filter: alpha(opacity=30);';
		divTop.style.display='block';
		document.body.appendChild(divTop);
		window.status='123';
                                alert('div显示');
		for(var i=0;i<1000;i++){
			for(var j=0;j<1000;j++){
				try{
					var m=3+4;
					var n=4+5;
					var p=6+6;
				}catch(e) {}
			}
		}
		divTop.style.display='none';
	}

 

2.不需要alert的

 

var divTop=null;	
function divAboveAll(){
	divTop = document.createElement('div');
	divTop.style.cssText='position:absolute;left:0px;top:0px;width:100%;height:100%;z-index:1100;background-color: #000000; filter: alpha(opacity=30);';
	divTop.style.display='block';
	document.body.appendChild(divTop);
	window.status='123';
	setTimeout(testdddd,0);
}
function testdddd(){
	for(var i=0;i<1000;i++){
		for(var j=0;j<1000;j++){
			try{
				var m=3+4;
				var n=4+5;
				var p=6+6;
			}catch(e) {}
		}
	}
	divTop.style.display='none';
}