Window对象加载时的区别与倒计时

 一，Window对象中的几种加载区别：

  //等全部内容都加载完之后才去执行外面的函数（传统的事件方法）
            // window.οnlοad=function(){
            //     alert('我是第一个网页');
            // }
            //监听事件，有效的解决多个事件同时产生时不会被停止运行，刷新速度最快，图片或者文档未刷 
            新出来时就已经展现出来
            // document.addEventListener('DOMContentLoaded',function(){
            //     alert('我是第一个网页');
            // })
            //调整浏览器的窗口大小
            // window.addEventListener('resize',function(){
            //         alert('调整浏览器窗口的大小');
            // })

补充传统事件：

element.οnclick=function(){

}

现在的监听事件：

element.addEventListener('click',function(){

})

注：监听事件中的点击按钮栏中所有事件不能添加on，例如传统事件与现在的监听事件的区别onclick与click的区别。

粉丝福利：（注：如有不明白的地方，粉丝朋友可以私信联系）

二，活动倒计时

   <div id="btn"></div>
        <!-- 在页面中添加div标签 -->
		<script>
		   // 获取元素
			var btn=document.querySelector('#btn');
			// 指定目标时间
			var date=+new Date("2022-06-30  18:00:00");
			// 定时器
			setInterval(showText,1000);
			// 封装一个函数,内部均是固定的内容
			function showText(){
				//获取当前的时间
				var data=+new Date();
				// 用设置指定的时间减去当前的时间除以1000获得毫秒数
				var dat=(date-data)/1000;
				// 下面是获得日
				var day=parseInt(dat/60/60/24);
				// 运用三元运算符判断得出是否需要在时间前面加字符0;一下均是
				// 同样的类型
				day=day<10? '0'+day:day;
				var hour=parseInt(dat/60/60%24);
				hour=hour<10? '0'+hour:hour;
				var mine=parseInt(dat/60%60);
				mine=mine<10? '0'+mine:mine;
				var swm=parseInt(dat%60);
				swm=swm<10? '0'+swm:swm;
			   var time= day+"日"+hour+"时"+mine+"分"+swm+"秒";
			   btn.innerHTML=time;
			}

下面是展示效果：