Home > Web Front-end > Front-end Q&A > How to set date and time using JavaScript

How to set date and time using JavaScript

PHPz
Release: 2023-04-24 11:16:52
Original
2322 people have browsed it

JavaScript is a commonly used programming language that is often used for web development. In web pages, we often need to obtain the current system time, or set certain operations to be performed at a certain point in the future. In this case, date and time functions in JavaScript are particularly important. This article explains how to set the date and time using JavaScript and provides some practical code examples.

Set the date

The date object (Date) in JavaScript is used to process date and time. We can create a new date object and then set attribute values ​​such as year, month, day, etc. to represent a specific date.

The following is some sample code for setting dates:

// 创建一个新的日期对象
var date = new Date();

// 设置年份为2021年
date.setFullYear(2021);

// 设置月份为3月,注意月份是从0开始计数的,所以3表示4月份
date.setMonth(3);

// 设置日期为15日
date.setDate(15);
Copy after login

In the above code, we first create a new date object, and then use setFullYear(), setMonth() and setDate( ) and other functions to modify some attribute values ​​​​of the date object. The final date object obtained represents April 15, 2021.

In addition, we can also use the Date.parse() function to convert a string into a date object. Here is an example:

var timestamp = Date.parse("2021-04-15T08:00:00.000Z");
var date = new Date(timestamp);
Copy after login

In the above code, we pass an ISO formatted time string to the Date.parse() function and assign the returned timestamp to the variable timestamp. We can then create a new date object using this timestamp.

Set the time

Just like setting the date, JavaScript also provides some functions for setting the time. We can use functions such as setHours(), setMinutes(), and setSeconds() to set the values ​​of hours, minutes, and seconds respectively.

The following is an example:

// 创建一个新的日期对象
var date = new Date();

// 设置小时为8点
date.setHours(8);

// 设置分钟为30分
date.setMinutes(30);

// 设置秒数为0秒
date.setSeconds(0);
Copy after login

In the above code, we use functions such as setHours(), setMinutes(), and setSeconds() to set the values ​​of hours, minutes, and seconds respectively. . The final date object represents 8:30:00 of the current day.

In addition to these functions, JavaScript also provides some functions for obtaining time information, such as getHours(), getMinutes(), getSeconds(), etc. We can use these functions to get the specific time value in the date object.

Set timer

In web development, we often need to perform some operations at a certain point in the future. For example, a message box pops up after 5 seconds, or the page data is updated every 10 seconds. At this time, you need to use the timer function in JavaScript.

There are two timer functions in JavaScript, namely setTimeout() and setInterval(). The difference between them is that the setTimeout() function is only executed once, while the setInterval() function is executed repeatedly.

The following is an example of using the setTimeout() function:

setTimeout(function() {
    alert("5秒钟已经过去了");
}, 5000);
Copy after login

In the above code, we use the setTimeout() function to set a 5-second timer. This function accepts two parameters, the first parameter is the callback function to be executed, and the second parameter is the timer time (in milliseconds). After 5 seconds, JavaScript will execute the callback function and pop up a message box.

The following is an example of using the setInterval() function:

var timer = setInterval(function() {
    console.log("10秒钟已经过去了");
}, 10000);
Copy after login

In the above code, we use the setInterval() function to set a 10-second timer. This function also accepts two parameters, the first parameter is the callback function to be executed, and the second parameter is the timer time. Unlike the setTimeout() function, JavaScript will execute the callback function repeatedly when the time expires.

If you need to cancel the timer, you can use the clearTimeout() and clearInterval() functions:

clearTimeout(timer);
clearInterval(timer);
Copy after login

In the above code, we use the clearTimeout() and clearInterval() functions respectively to cancel the previous settings. timer.

Summary

This article introduces how to use JavaScript to set the date and time, and how to use the timer function to perform some operations at a certain point in the future. The date and time functions in JavaScript are very practical and are often used in web development. Finally, we provide some practical code examples that we hope will be helpful to developers.

The above is the detailed content of How to set date and time using JavaScript. For more information, please follow other related articles on the PHP Chinese website!

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