欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

JavaScript中时间日期常用操作小结

程序员文章站 2022-06-17 10:11:52
目录前言创建时间日期对象Date获取与设置年月日时分秒增量与时间差区间判断前言在一个web应用中,时间日期的判断非常常见,我们希望根据不同的时间段,显示不同的信息,或者是获取当前时间前后几分钟,或者是单纯显示规格化的时间,这些都需要用到时间日期对象,今天来总结一下JavaScript中时间的常用操作。创建时间日期对象Date通过var dt = new Date();可以快速创建一个时间日期对象,它表示当前时间。我们通过以下的代码,可以打印一个date对象:...

前言

在一个web应用中,时间日期的判断非常常见,我们希望根据不同的时间段,显示不同的信息,或者是获取当前时间前后几分钟,或者是单纯显示规格化的时间,这些都需要用到时间日期对象,今天来总结一下JavaScript中时间的常用操作。

创建时间日期对象Date

通过var dt = new Date();可以快速创建一个时间日期对象,它表示当前时间。我们通过以下的代码,可以打印一个date对象:

<!DOCTYPE html>
<html>
<head>
	<title>local storage test</title>
</head>
<body>
	<script type="text/javascript">
		var dt = new Date();
		document.write("Date对象: " + dt + "<br>");
	</script>
</body>
</html>

JavaScript中时间日期常用操作小结
当然也可以传入参数来创建date对象,构造函数的参数列表分别是 年 月 日 时 分 秒 毫秒,可以传部分参数

以下的构造方法创建一个2035年11月4日5点14分19秒的时间

var dt = new Date(2035, 11, 4, 5, 14, 19);
document.write("Date对象: " + dt + "<br>");

JavaScript中时间日期常用操作小结

传入部分参数的情况下,默认从年开始读取,逐个向后读取参数,直到结束

值得注意的是,未被初始化的参数,将由0代替,如下的代码指定了2035年11月4日5时,但是并未指定分和秒,可以查看结果:

var dt = new Date(2035, 11, 4, 5);
document.write("Date对象: " + dt + "<br>");

JavaScript中时间日期常用操作小结

获取与设置年月日时分秒

date对象内置了一系列函数来帮助我们获取 / 设置 各种属性,比如获取年月日时分秒,以下的函数将获取各个属性

getFullYear()	// 获取四位数年份比如 1919
getMonth()		// 获取月份 0-11 对应 1-12月
getDate()		// 获取日期 比如 21
getHours()		// 获取小时 0-23 小时
getMinutes()	// 获取分钟
getSeconds()	// 获取秒
getMilliseconds()	// 毫秒(用的比较少。。)

将上述所有函数的get改为set,我们得到设置属性的方法,值得注意的是,这些setxxx的方法,自带进位,比如setMonth(33),超过一个月的天数,会被加到下一个月,月超过12,自动加年,也就是说我们可以直接做年月日时分秒的加减了,这是好的。

如下的代码演示了设置与获取date对象的属性,我们将时间设置为2035年11月4日5点14分19秒777毫秒,值得注意的是,月份的设置,要-1

<!DOCTYPE html>
<html>
<head>
	<title>local storage test</title>
</head>
<body>
	<script type="text/javascript">
		var dt = new Date();

		dt.setFullYear(2035);
		dt.setMonth(11-1);
		dt.setDate(4);
		dt.setHours(5);
		dt.setMinutes(14);
		dt.setSeconds(19);
		dt.setMilliseconds(777);
		
		document.write("年: " + dt.getFullYear()     + "<br>");
		document.write("月: " + (dt.getMonth()+1)    + "<br>");
		document.write("日: " + dt.getDate()         + "<br>");
		document.write("时: " + dt.getHours()        + "<br>");
		document.write("分: " + dt.getMinutes()      + "<br>");
		document.write("秒: " + dt.getSeconds()      + "<br>");
		document.write("毫秒: " + dt.getMilliseconds() + "<br>");
	</script>
</body>
</html>

JavaScript中时间日期常用操作小结

增量与时间差

我们有时候需要获取一个时间的前5分钟,或者后2小时,后3天,后一个月等等,那么我们就需要对date对象做出一定的修改。

我们通过getxxx()方法获取对应的属性v,然后再用setxxx(v + 增量)的方法,为date对象设置增量。值得注意的是,这个增量是自带进位的,打个比方,你增加1000秒,那么最后得到的秒数还是0-59,而分钟和小时数,发生变化了。

菊搁栗子,我们设置时间为2035年11月4日5点14分19秒777毫秒,然后我们增加55分钟,可以看到,date对象自动实现自增进位,非常方便。

<!DOCTYPE html>
<html>
<head>
	<title>local storage test</title>
</head>
<body>
	<script type="text/javascript">

		var dt = new Date();

		dt.setFullYear(2035);
		dt.setMonth(11-1);
		dt.setDate(4);
		dt.setHours(5);
		dt.setMinutes(14);
		dt.setSeconds(19);
		dt.setMilliseconds(777);

		dt.setMinutes(dt.getMinutes() + 55);	// 增加55分钟
		
		document.write("年: " + dt.getFullYear()     + "<br>");
		document.write("月: " + (dt.getMonth()+1)    + "<br>");
		document.write("日: " + dt.getDate()         + "<br>");
		document.write("时: " + dt.getHours()        + "<br>");
		document.write("分: " + dt.getMinutes()      + "<br>");
		document.write("秒: " + dt.getSeconds()      + "<br>");
		document.write("毫秒: " + dt.getMilliseconds() + "<br>");
		
	</script>
</body>
</html>

JavaScript中时间日期常用操作小结
两个date对象也可以直接相减,返回的是相差的毫秒数。如下例子,的代码设置dt1为当前时间,dt2为10分钟之后,然后做差,可以得到相差的毫秒数,600000ms,刚好是10分钟

<!DOCTYPE html>
<html>
<head>
	<title>local storage test</title>
</head>
<body>
	<script type="text/javascript">

		var dt1 = new Date();
		var dt2 = new Date();
		
		dt2.setMinutes(dt2.getMinutes()+10);
		document.write(dt2-dt1);
		
	</script>
</body>
</html>

JavaScript中时间日期常用操作小结

区间判断

有时候需要判断当前时间在不在一个区间,比如在不在当天的 13:00 - 17:00 中,这时候就需要做时间的区间判断,幸运的是,JavaScript的date对象,已经重载了比较运算符,我们可以用大于小于号,直接比较两个日期,非常方便。

我们先获取当前日期,然后设置上下限为当天的几点到几点,最后比较,查看当前时间是否在区间中。如下演示小时区间,分钟,秒,毫秒同理。

<!DOCTYPE html>
<html>
<head>
	<title>local storage test</title>
</head>
<body>
	<script type="text/javascript">

		var cur = new Date();
		var y = cur.getFullYear();
		var m = cur.getMonth();
		var d = cur.getDate();

		var lower = new Date(y, m, d, 13);	// 下限为13:00
		var upper = new Date(y, m, d, 17);	// 上限为17:00

		if(lower<cur && cur<upper) {
			document.write("当前时间在 13:00 - 17:00 之间");
		}
		
	</script>
</body>
</html>

运行这段代码的时间是中午,所以我们成功打印了信息。
JavaScript中时间日期常用操作小结

本文地址:https://blog.csdn.net/weixin_44176696/article/details/107486685