JavaScript Date 日期对象实例合集

梁辰兴

已于 2023-03-07 10:28:46 修改

阅读量326

点赞数

分类专栏： JavaScript 编程基础文章标签： javascript 前端 html date对象实例合集

于 2023-02-26 20:47:12 首次发布

本文链接：https://blog.csdn.net/m0_62617719/article/details/129231233

版权

JavaScript 编程基础专栏收录该内容

75 篇文章 73 订阅

订阅专栏

该文详细介绍了JavaScript中的Date对象，包括使用Date()获取当前日期，getFullYear()获取年份，getTime()获取毫秒数，setFullYear()设置日期，toUTCString()转换为UTC字符串，getDay()结合数组显示星期，以及创建实时钟表的示例代码。

摘要由CSDN通过智能技术生成

文章目录

JavaScript Date 日期对象实例合集

JavaScript Date 日期对象实例合集

在这里插入图片描述

本文用于收集与JavaScript Date 日期对象相关的实例~

一，使用 Date() 方法获得当日的日期

源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var d=new Date();
document.write(d);
</script>
</body>
</html>

运行效果：
在这里插入图片描述

二，使用 getFullYear() 获取年份

源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p id="demo">点击按钮获取今年的年份。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var d = new Date();
	var x = document.getElementById("demo");
	x.innerHTML=d.getFullYear();
}
</script>
</body>
</html>

运行效果：
在这里插入图片描述

三，使用getTime() 返回从 1970 年 1 月 1 日至今的毫秒数

源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p id="demo">单击按钮显示1970年1月1号至今的毫秒数。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var d = new Date();
	var x = document.getElementById("demo");
	x.innerHTML=d.getTime();
}
</script>
</body>
</html>

运行效果：
在这里插入图片描述

四，如何使用 setFullYear() 设置具体的日期

源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p id="demo">单击按钮显示修改后的年月日。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var d = new Date();
	d.setFullYear(2020,10,3);
	var x = document.getElementById("demo");
	x.innerHTML=d;
}
</script>
<p>记住 JavaScript 月数是从0至11，10是11月。</p>
</body>
</html>

运行效果：
在这里插入图片描述

五，使用 toUTCString() 将当日的日期（根据 UTC）转换为字符串

源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p id="demo">点击按钮把 utc 日期和时间转换成字符串。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var d = new Date();
	var x = document.getElementById("demo");
	x.innerHTML=d.toUTCString();
}
</script>
</body>
</html>

运行效果：
在这里插入图片描述

六，使用 getDay() 和数组来显示星期，而不仅仅是数字

源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p id="demo">单击按钮显示今天周几</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var d = new Date();
	var weekday=new Array(7);
	weekday[0]="周日";
	weekday[1]="周一";
	weekday[2]="周二";
	weekday[3]="周三";
	weekday[4]="周四";
	weekday[5]="周五";
	weekday[6]="周六";
	var x = document.getElementById("demo");
	x.innerHTML=weekday[d.getDay()];
}
</script>
</body>
</html>

运行效果：
在这里插入图片描述

七，在网页上显示一个钟表

源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
function startTime(){
	var today=new Date();
	var h=today.getHours();
	var m=today.getMinutes();
	var s=today.getSeconds();// 在小于10的数字钱前加一个‘0’
	m=checkTime(m);
	s=checkTime(s);
	document.getElementById('txt').innerHTML=h+":"+m+":"+s;
	t=setTimeout(function(){startTime()},500);
}
function checkTime(i){
	if (i<10){
		i="0" + i;
	}
	return i;
}
</script>
</head>
<body onload="startTime()">
<div id="txt"></div>
</body>
</html>