《HTML教程》-8.4教学材料

8.4.1创建日期对象

创建日期对象是通过Date构造函数，用new关键字创建的。Date的构造函数有4种方式，分别表示如下：◆Date()——创建代表当前时间的Date对象。◆Date(dateString)——用指定的时间字符串创建日期对象。◆Date(milliseconds)——用指定的长整数——表示自1970年1月1日0时0分0秒开始到指定时间经过的毫秒数——创建日期对象。◆Date(year,month,day,hours,minutes,seconds,milliseconds)——用指定的年、月、日时、分、秒、毫秒创建日期对象。采用日期字符串构造日期对象时，可采用的日期格式如下：◆MM/DD/YYYY——也称为短格式，如09/01/2017。还可以写成YYYY/MM/DD，如2017/09/01。◆YYYY-MM-DD——ISO8601采用的标准时间格式，也称为长格式，为JavaScript的首先格式，如2017-09-01。也可以写作YYYY-MM，或者YYYY。还可以加上时间YYYY-MM-DDTHH:MM:SS，其中T为规定的元字符，在设置具体的时间时要保留。以上两种格式也是国际标准格式，如果实际工作中遇到特殊要求的日期格式，请参考JavaScript手册或相关网站。在上面第4种构造函数创建日期对象时要注意：月份month的值为0~11，毫秒milliseconds的取值范围为0~999，这两点需要特别注意。8.4.2Date对象的方法Date方法允许你获得或设置日期对象中的年、月、日、时、分、秒和毫秒，并可以把日期字符串转换成日期对象，也可以把日期对象转换成字符串对象等等。有了这些方法就可以很方便的操作日期对象了。Date对象提供的方法如表8-4所示。应用实例用到的界面如8-4所示。实现的功能是单击“提交”按钮，可以把你选择的日期包装（转换）成日期对象，并显示几种日期的格式。按“比较”按钮，可以对日期1和日期2进行比较，计算两个日期相差的天数。图8-4日期实例界面要读取日期控件的值，首先要查找到相应的日期控件，这里使用getElementById()进行查找，查找到日期控件（HTML标记）之后，可以通过日期控件的value属性读取它的值，代码如下：varbirth=document.getElementById("birth").value;变量brith存放日期控制输入的值。要把这个birth值——格式形如2017-09-20——转换成日期对象，有两种方式：使用Date构造函数，或者使用Date的parse()方法。但两种方式有区别，Date构造函数得到的是日期对象，而Date的parse()方法得到的是一个长整数表示。这里使用构造函数的方法，把日期类型的字符串转换成日期对象，代码如下：vardateBirth=newDate(birth);显示格式只用了常用的3种：◆toString()——最普通的格式，没有任何格式要求，只把日期对象转换成字符串表示。◆toLocaleDateString()——按照所在地域使用的日期格式，显示日期对象的日期部分。◆toJSON()——按照JSON的格式（字符串）显示日期对象的值。我们按照以上三种方式把三种日期连接成一个字符串，并加入了换行符<br/>，然后再显示在id为display的div中，代码如下：vardisplay="toString():"+dateBirth.toString() +"<br/>toLocaleDateString():"+dateBirth.toLocaleDateString()+"<br/>toJSON():"+dateBirth.toJSON();document.getElementById("display").innerHTML=display;为了使大家能够看清两种日期——日期字符串和日期对象——的区别，我们使用typeofbirth显示了birth（日期控件的值）的类型，返回值为“string”，说明日期控件的值是字符串类型，而dateBirth（birth包装成日期的对象）用instanceof运算符查看其类型，注意这里不能使用typeof运算符，因为使用typeof时只能返回object，而不是date。所需要的代码如下：console.log(typeofbirth);console.log(dateBirthinstanceofDate);console为JavaScript的控制台，两个运算结果就显示在控制台上（有关控制台的内容见4.5.1节）。要进行两个日期的比较，最直接的方法就是把两个日期全部转换成长整数（即自1970年1月1日0时0分0秒经过的毫秒数），再比较这两个长整数的大小。这有两种情况：

◆两个日期对象比较——通过Date对象的getTime()方法获得时间的长整数表示，然后进行比较。

◆两个日期字符串比较——通过Date对象的parse()方法将日期字符串转换成长整数表示，再进行比较。在这个例子中，要比较用户选择的两个日期的大小，也就是两个日期字符串进行比较，所以采用后一种方式，即通过parse()方法把日期字符串转换成长整数表示，再进行比较，代码如下：vard1=document.getElementById("date1").value;vard2=document.getElementById("date2").value;vard1Num=Date.parse(d1);vard2Num=Date.parse(d2);对于比较结果，我们采用“日期1比日期2早/晚多少天”的方式进行表达。实现过程首先，要计算两个日期长整数的差值，但因为不能确定两个日期的早晚（或者说两个长整数的大小），所以只能使用这个差的绝对值（Math.abs()），求出时间之差后再除以一天的毫秒数，就得到两个日期相差的天数。早和晚是由两个长整数的大小决定的，长整数越大说明时间越晚，越小说明日间越早，求得结果（“日期1比日期2早/晚多少天”）的代码如下所示：varresult="";if(d1Num>d2Num){//计算两个日期的“早”“晚”result="晚";}else{ result="早";}vardifference=Math.abs(d1Num-d2Num);vardays=difference/1000/60/60/24;//计算两日期相差的天数在表达结果时我们不能把两个长整数作为日期显示给用户，所以还要把长整数转换成日期对象。这可采用声明日期对象，然后调用setTime()方法实现把长整数转换成日期对象，代码如下：vardate1=newDate();date1.setTime(d1Num);vardate2=newDate();date2.setTime(d2Num);最后就是把计算结果显示在id为display的div中，代码如下：document.getElementById("display").innerHTML= date1.toL