JavaScript 日期对象


目录

    显示目录


JavaScript 日期对象让我们可以处理日期:

年:

在 Javascript 中获取当前年份的示例:

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>The getFullYear() Method</h2>
<p>Return the full year of a date object:</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getFullYear();
</script>

</body>
</html>

月:

在 Javascript 中获取当前月份的示例:

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getMonth() Method</h2>
<p>Return the month of a date as a number from 0 to 11.</p>
<p>To get the correct month number, you must add 1:</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getMonth() + 1;
</script>

</body>
</html>

天:

在 Javascript 中获取当前日期的示例:

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getDate() Method</h2>
<p>Return the day of a date as a number (1-31):</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getDate();
</script>

</body>
</html>

小时:

在 Javascript 中获取当前小时的示例:

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getHours() Method</h2>
<p>Return the hours of a date as a number (0-23):</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getHours();
</script>

</body>
</html>

分钟:

在 Javascript 中获取当前分钟的示例:

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getMinutes() Method</h2>
<p>Returns the minutes of a date as a number (0-59):</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getMinutes();
</script>

</body>
</html>

秒:

在 Javascript 中获取当前秒数的示例:

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getSeconds() Method</h2>
<p>Return the seconds of a date as a number (0-59):</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getSeconds();
</script>

</body>
</html>

例子

const d = new Date();

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>new Date() without arguments, creates a date object with the current date and time:</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>
const d = new Date("2022-03-25");

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>

<p id="demo"></p>

<script>
const d = new Date("2022-03-25");
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

笔记

日期对象是静态的。 “时钟”没有“运行”。

计算机时钟在滴答作响,而日期对象则不然。


JavaScript 日期输出

默认情况下,JavaScript 将使用浏览器的时区并将日期显示为全文字符串:

在本教程的后面部分,您将了解有关如何显示日期的更多信息。


创建日期对象

日期对象是用 new Date() 构造函数。

9种方法创建新的日期对象:

new Date()
new Date(date string)

new Date(year,month)
new Date(year,month,day)
new Date(year,month,day,hours)
new Date(year,month,day,hours,minutes)
new Date(year,month,day,hours,minutes,seconds)
new Date(year,month,day,hours,minutes,seconds,ms)

new Date(milliseconds)

JavaScript new Date()

new Date() 使用当前日期和时间创建日期对象:

例子

const d = new Date();

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>Create a new date object with the current date and time:</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

新日期(日期字符串

new Date(日期字符串)日期字符串创建日期对象:

例子

const d = new Date("October 13, 2014 11:13:00");

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>

<p>A date object can be created with a specified date and time:</p>
<p id="demo"></p>

<script>
const d = new Date("October 13, 2014 11:13:00");
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>
const d = new Date("2022-03-25");

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>

<p id="demo"></p>

<script>
const d = new Date("2022-03-25");
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

日期字符串格式将在下一章中介绍。


新日期(年、月、...

new Date(年、月、...) 创建一个具有指定日期和时间的日期对象。

7 个数字指定年、月、日、小时、分钟、秒和毫秒(按顺序):

例子

const d = new Date(2018, 11, 24, 10, 33, 30, 0);

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>

<p>Using new Date(7 numbers), creates a new date object with the specified date and time:</p>

<p id="demo"></p>

<script>
const d = new Date(2018, 11, 24, 10, 33, 30, 0);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

笔记

JavaScript 计算从 011 的月份:

一月=0

12 月=11

指定高于 11 的月份不会导致错误,而是将溢出添加到下一年:

指定:

const d = new Date(2018, 15, 24, 10, 33, 30);

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript new Date()</h1>

<p>JavaScript counts months from 0 to 11.</p>
<p>Specifying a month higher than 11, will not result in an error but add the overflow to the next year:</p>

<p id="demo"></p>

<script>
const d = new Date(2018, 15, 24, 10, 33, 30, 0);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

是相同的:

const d = new Date(2019, 3, 24, 10, 33, 30);

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript new Date()</h1>

<p>JavaScript counts months from 0 to 11.</p>

<p id="demo"></p>

<script>
const d = new Date(2019, 3, 24, 10, 33, 30, 0);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

指定高于 max 的日期不会导致错误,但会将溢出添加到下个月:

指定:

const d = new Date(2018, 5, 35, 10, 33, 30);

是相同的:

const d = new Date(2018, 6, 5, 10, 33, 30);

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>

<p>JavaScript counts months from 0 to 11.</p>
<p>Specifying a day higher than max, will not result in an error but add the overflow to the next month:</p>

<p id="demo"></p>

<script>
const d = new Date(2018, 05, 35, 10, 33, 30, 0);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

使用 6、4、3 或 2 个数字

6个数字分别表示年、月、日、时、分、秒:

例子

const d = new Date(2018, 11, 24, 10, 33, 30);

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>
<p>6 numbers specify year, month, day, hour, minute and second:</p>

<p id="demo"></p>

<script>
const d = new Date(2018, 11, 24, 10, 33, 30);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

年、月、日、时、分由 5 个数字表示:

例子

const d = new Date(2018, 11, 24, 10, 33);

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>
<p>5 numbers specify year, month, day, hour, and minute:</p>

<p id="demo"></p>

<script>
const d = new Date(2018, 11, 24, 10, 33);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

4 个数字指定年、月、日和小时:

例子

const d = new Date(2018, 11, 24, 10);

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>
<p>4 numbers specify year, month, day, and hour:</p>

<p id="demo"></p>

<script>
const d = new Date(2018, 11, 24, 10);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

3 个数字指定年、月、日:

例子

const d = new Date(2018, 11, 24);

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>
<p>3 numbers specify year, month, and day:</p>

<p id="demo"></p>

<script>
const d = new Date(2018, 11, 24);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

2 个数字指定年份和月份:

例子

const d = new Date(2018, 11);

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>
<p>2 numbers specify year and  month:</p>

<p id="demo"></p>

<script>
const d = new Date(2018, 11);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

不能省略月份。如果您只提供一个参数,它将被视为毫秒。

例子

const d = new Date(2018);

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>
<p>One parameter will be interpreted as new Date(milliseconds).</p>

<p id="demo"></p>

<script>
const d = new Date(2018);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

上个世纪

一位数和两位数年份将被解释为 19xx:

例子

const d = new Date(99, 11, 24);

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>
<p>Two digit years will be interpreted as 19xx:</p>

<p id="demo"></p>

<script>
const d = new Date(99, 11, 24);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

例子

const d = new Date(9, 11, 24);

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript new Date()</h2>
<p>One digit years will be interpreted as 19xx:</p>

<p id="demo"></p>

<script>
const d = new Date(9, 11, 24);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

JavaScript 将日期存储为毫秒

JavaScript 将日期存储为自 1970 年 1 月 1 日以来的毫秒数。

零时间是 1970 年 1 月 1 日 00:00:00 UTC

一天(24 小时)为 86 400 000 毫秒。

现在时间是:

1970 年 1 月 1 日过去的毫秒数


新日期(毫秒

new Date(毫秒) 创建一个新的日期对象,为毫秒加上零时间:

例子

1970 年 1 月 1 日加上 100 000 000 000 毫秒为:

const d = new Date(100000000000);

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>

<p>100000000000 milliseconds from January 01 1970 UTC is:</p>
<p id="demo"></p>

<script>
const d = new Date(100000000000);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

1970 年 1 月 1 日 100 000 000 000 毫秒是:

const d = new Date(-100000000000);

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>

<p>-100000000000 milliseconds from January 01 1970 UTC is:</p>
<p id="demo"></p>

<script>
const d = new Date(-100000000000);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

1970 年 1 月 1 日加上 24 小时为:

const d = new Date(24 * 60 * 60 * 1000);
// or
const d = new Date(86400000);

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>

<p>86400000 milliseconds from January 01 1970 UTC is:</p>
<p id="demo"></p>

<script>
const d = new Date(86400000);
document.getElementById("demo").innerHTML = d;
</script>

<p>One day (24 hours) is 86,400,000 milliseconds.</p>

</body>
</html>

1970 年 1 月 1 日加上 0 毫秒为:

const d = new Date(0);

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>

<p>0 milliseconds from January 01 1970 UTC is:</p>
<p id="demo"></p>

<script>
const d = new Date(0);
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>


日期方法

创建日期对象时,可以使用许多方法进行操作 它。

日期方法允许您获取和设置年、月、日、小时、 日期对象的分钟、秒和毫秒,使用本地时间或 UTC (通用或 GMT)时间。

日期方法和时区将在接下来的章节中介绍。


显示日期

JavaScript 将(默认情况下)使用 toString() 方法输出日期。 这是日期的字符串表示形式,包括时区。 ECMAScript 规范中指定了格式:

例子

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>new Date() without arguments, creates a date object with the current date and time:</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d;
</script>

</body>
</html>

当您在 HTML 中显示日期对象时,它会自动转换为 字符串,使用 toString() 方法。

例子

const d = new Date();
d.toString();

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>The toString() Method</h2>

<p>Convert a date to a string:</p>
<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toString();
</script>

</body>
</html>

toDateString() 方法将日期转换为更易读的日期 格式:

例子

const d = new Date();
d.toDateString();

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>The toDateString() Method</h2>
<p>Convert a date to a date string:</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toDateString();
</script>

</body>
</html>

toUTCString() 方法使用 UTC 标准将日期转换为字符串:

例子

const d = new Date();
d.toUTCString();

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>The toUTCString() Method</h2>
<p>Convert a date to a string using the UTC standard:</p>

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toUTCString();
</script>

</body>
</html>

toISOString() 方法使用 ISO 标准将日期转换为字符串:

例子

const d = new Date();
d.toISOString();

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Dates</h1>
<h2>The toISOString() Method</h2>

<p>Convert a date to a string using the ISO standard:</p>
<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toISOString();
</script>

</body>
</html>

完整的 JavaScript 日期参考

如需完整的日期参考,请访问我们的:

完整的 JavaScript 日期参考。

该参考包含所有日期属性的描述和示例 方法。