Home > Web Front-end > JS Tutorial > body text

How to get the current time in javascript

青灯夜游
Release: 2023-01-07 11:41:18
Original
86086 people have browsed it

In javascript, you can use the Date() method in the Date object to get the current time, which can return the date and time of the day; you can also use "new Date()" to create a time object, using Built-in time reading method to obtain year, month, day, hour, minute, second and other information respectively.

How to get the current time in javascript

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

In javascript, you can use the Date() method in the Date object to get the current time. The Date() method returns today's date and time.

Date()
Copy after login

Example: Output today’s date and time

console.log(Date())
Copy after login

Output:

How to get the current time in javascript

Or use different methods in the Date object to format the time , displays the time in a fixed format.

First use new Date() to create a current time object, then use get as the prefix time reading method to obtain the current year, month, day, hour, minute, second and other information, and finally use timing The server settings are executed once every second to achieve real-time updates.

[Operation Steps]

1) Design a time display function. In this function, first create a Date object, obtain the current time, and then obtain the year, month, and day respectively. Minutes, hours, minutes, seconds and other information are finally assembled into a time string and returned.

var showtime = function () {
    var nowdate = new Date();
    var year = nowdate.getFullYear(),
        month = nowdate.getMonth() + 1,
        date = nowdate.getDate(),
        day = nowdate.getDay(),
        week = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
        h = nowdate.getHours(),
        m = nowdate.getMinutes(),
        s = nowdate.getSeconds(),
        h = checkTime(h),
        m = checkTime(m),
        s = checkTime(s);
    return year + "年" + month + "月" + date + "日" + week[day] + " " + h +":" + m + ":" + s;
}
Copy after login

2) Because the time format you usually see is generally 00:00:01, and the getHours(), getMinutes(), and getSeconds() methods get the format from 0 to 9, not 00 to 09. format. So in the process of changing from 9 to 10, from one digit to two digits, it also goes from 59 seconds to 0 seconds, or 59 minutes to 0 minutes, or 23 hours to 0 hours. For example: the next second of 23:59:59 should be 00:00:00, but it is actually 0:0:0. In this way, the format is not uniform. Visually, the number also suddenly increases or decreases, causing a kind of shaking. a feeling of.

Define an auxiliary function below to change the one-digit time to two-digit display.

var checkTime = function (i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
Copy after login

3) Add a tag to the page and set the value of id.

<h1 id="showtime"></h1>
Copy after login

4) Bind a timer to the label, and set the time display function to be called once every second in the timer.

var div = document.getElementById("showtime");
setInterval (function() {
    div.innerHTML = showtime();
}, 1000);  //反复执行函数
Copy after login

The displayed results are as follows:

How to get the current time in javascript

[Related recommendations: javascript learning tutorial]

The above is the detailed content of How to get the current time in javascript. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template