27内置日期对象Date 延时器 制作倒计时 BOM

一、内置日期对象Date

日期对象类型使用子UTC (Coordinated Universal Time，国际协调时间) 1970年1月1日午夜 (零点) 开始经过毫秒数来保存日期。Date类型保存的日期能够精确到1970年1月1日或之后的285616年

创建一个日期对象
var d = new Date()从日期对象获取信息d.getFullYear()		//获取年d.getMonth()		//获取月，月份是从0开始计算d.getDate()			//获取日期d.getDay()			//获取周d.getHours()		//获取小时d.getMinutes()		//获取分钟d.getSeconds()		//获取秒数d.getMilliseconds()	//获取毫秒时间戳d.getTime()			//获取从1970年1月1日至今的毫秒设置日期,直接设置时间，会清零时分秒
var d = new Date("2021/11/5 00:00:00")
var d = new Date("2021-11-5 00:00:00")从日期对象设置信息d.setFullYear()		//设置年d.setMonth()		//设置月，超过11累加年d.setDate()			//设置日期，超过最大日期累加月d.setHours()		//设置小时，超过24累加天d.setMinutes()		//设置分钟，超过60累加小时d.setSeconds()		//设置秒数，超过60累加分钟d.setMilliseconds()	//设置毫秒，超过1000累加秒时间戳d.setTime()			//设置从1970年1月1日过去了多少毫秒

二、使用定时器和内置日期制作一个倒计时

//使用严格模式
"use strict"//获取元素
var h1 = document.getElementsByTagName("h1")[0]//设置需要倒计时的时间
var endTime = new Date("2022/1/1 00:00:00")//
var t = function () {var nowTime = new Date()//现在和需要倒计时的时间相差的毫秒数var seconds = parseInt((endTime.getTime() - nowTime.getTime()) / 1000)//计算天数var d = parseInt(seconds / 3600 / 24)//计算小时数var h = parseInt(seconds / 3600 % 24)//计算分钟var m = parseInt(seconds / 60 % 60)//计算秒数var s = parseInt(seconds % 60)//为了让数字小于10时显示成两位数if(d < 10) {d = "0" + d}if(h < 10) {h = "0" + h}if (m < 10) {m = "0" + m}if(s < 10) {s = "0" + s}//倒计时内容h1.innerHTML = "距离新年还有" + d + "天" + h + "小时" + m + "分钟" + s + "秒"
}//先调用一次，避免闪烁
t()//使用定时器，每1s计算一次
setInterval(t, 1000)

html部分只需要一个盒子来装倒计时内容

<h1></h1>

三、BOM

BOM (Browser Object Model) 浏览器对象模型

作用

主要提供了访问和操作浏览器各组件的方式

- window浏览器窗口对象是js中最大的对象，其他所有的对象都是window的子对象- document文档对象，代表一个网页- location地址对象，对地址栏的操作一些方法- navigation浏览器软件对象，主要用来判断用户用的是什么浏览器，可以解决兼容性问题- scree屏幕对象，可以获取屏幕相关的信息- history历史记录对象，可以对浏览器的历史记录进行相关的操作

注意点

- window是全局浏览器内置顶级对象，表示浏览器中打开的窗口
（没有应用于window对象的公开标准，不过所有浏览器都支持该对象）window对象表示一个浏览器窗口或一个框架- 在客户端JavaScript中，window对象是全局对象，所有的表达式都在
当前的环境中计算，也就是说，要引用当前窗口根本不需要特殊的语法，
可以把那个窗口的属性作为全局变量来使用

四、BOM window对象常用的方法

- prompt()	显示可提示用户输入的对话框- alert()	显示一个带有提示信息和一个“确定”按钮的警示对话框- close()	关闭浏览器窗口- confirm()	显示一个带有提示信息、“确定”和“取消”按钮的对话框- 定时器间隔定时器setInterval()	clearInerval()超时定时器setTimeout()	clearTimeout()