使用JS完成页面定时弹出广告

1. 技术分析

隐藏图片：display:none

       定时操作：setInterval("显示图片的函数",3000);

2. 步骤分析

第一步：确定事件（页面加载onload）,并为其绑定一个函数init()

第二步：在init（）函数中设置一个显示图片的定时操作

第三步：书写函数显示图片的函数（获取图片元素，设置其display 属性为block）

第四步：设置一个隐藏图片的定时操作

第五步：书写隐藏图片的函数（获取图片元素，设置其display 属性为block）

4.JavaScript部分代码：

	//书写显示图片的定时操作
	setInterval("changImg()",3000);
	//1.设置图片的定时操作
	time = setInterval("showAd()",3000);
	}
	//书写定时操作
         var i = 0;
			function changeImg(){
			i++;
			//将图片名称修改为 数字.jpg 方便进行 i++操作
			document.getElementById("img1").src="./img/" +i+".jpg";
			if(i==3){
			    i=0;
			}
		}
//2.书写显示广告图片的函数		
	function showAd(){
		//3.获取图片的位置
		var adEle = document.getElementById("img2");
		//4.修改广告图片元素里面的属性，让其显示
		adEle.style.display = "block";
		//5.清除显示图片的定时操作
		clearInterval(time);
		//6.设置一个隐藏图片的定时操作
		time = setInterval("hiddenAd()",3000);
	}
	//7.书写隐藏广告图片的函数
	function hiddenAd(){
		//8.获取图片的位置并设置其style的属性displayz值为none
		document.getElementById("img2").style.display = "none";
		//9.清除显示图片的定时操作
		clearInterval(time);
	}