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

最新推荐文章于 2023-07-26 09:55:22 发布

AkagiSenpai

最新推荐文章于 2023-07-26 09:55:22 发布

阅读量371

点赞数 1

分类专栏：前后端文章标签： javascript java

本文链接：https://blog.csdn.net/weixin_44176696/article/details/107486685

版权

前后端专栏收录该内容

27 篇文章 6 订阅

订阅专栏

前言

在一个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>

在这里插入图片描述
当然也可以传入参数来创建date对象，构造函数的参数列表分别是 年月日时分秒毫秒，可以传部分参数

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

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

在这里插入图片描述

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

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

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

在这里插入图片描述

获取与设置年月日时分秒

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>

在这里插入图片描述

增量与时间差

我们有时候需要获取一个时间的前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>

在这里插入图片描述
两个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>

在这里插入图片描述

区间判断

有时候需要判断当前时间在不在一个区间，比如在不在当天的 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>

运行这段代码的时间是中午，所以我们成功打印了信息。
在这里插入图片描述

AkagiSenpai

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JavaScript中时间日期常用操作小结

目录前言创建时间日期对象Date获取与设置年月日时分秒增量与时间差区间判断前言在一个web应用中，时间日期的判断非常常见，我们希望根据不同的时间段，显示不同的信息，或者是获取当前时间前后几分钟，或者是单纯显示规格化的时间，这些都需要用到时间日期对象，今天来总结一下JavaScript中时间的常用操作。创建时间日期对象Date通过var dt = new Date();可以快速创建一个时间日期对象，它表示当前时间。我们通过以下的代码，可以打印一个date对象：<!DOCTYPE html&gt
复制链接

扫一扫