Do you want to find ways to add hours to a date in JavaScript? Don’t worry, we will give you some helpful methods to do it. Follow this article now.
Some ways to add hours to a date in JavaScript?
Method 1: Use the getTime()
The method below will help us to create a new function to do what we need
JavaScript getTime().
Syntax of this method:
Date.getTime()
This method will return the numbers of milliseconds from midnight of January 1, 1970, to the specified date we pass in.
Example:
// Assign current date and time to variable
const now = new Date();
console.log({ now });
// getTime() will returns the number of milliseconds since midnight January 1, 1970
console.log(now.getTime());Output :
{ now: 2022-09-07T11:45:17.142Z }
1662551117142Method 2: Use the setTime() method
Javascript setTime() method sets a date by adding time to midnight January 1, 1970.
Syntax of this method:
Date.setTime(millisec)
Parameters:
- millisec: Required. Time you want to add to midnight January 1, 1970 in milliseconds.
Example of setTime() method:
const d = new Date();
console.log({ d });
// Set d by add 9909091231233 milliseconds to January 1, 1970
d.setTime(9909091231233);
console.log({ d });Output:
d: 2022-09-07T12:20:40.362Z }
{ d: 2284-01-03T13:20:31.233Z }Method 3: Add hours to date in Javascript solution
Example: add 1 hour through click button.
<!DOCTYPE HTML>
<html>
<head>
<title>
LearnShareIT: Adding hours to Date object in JS
</title>
</head>
<body
id="body">
<h1 style="color:rgb(14, 133, 180)">
LearnShareIT
</h1>
<p class="timeNow"
style="font-size: 1rem;
font-weight: lighter;">
</p>
<button >
addHours
</button>
<p class="timeAdd"
style=" font-size: 1rem;
font-weight: lighter;">
</p>
<script>
const button = document.querySelector('button')
const timeNow = document.querySelector(".timeNow");
const timeAdd = document.querySelector(".timeAdd")
const today = new Date();
timeNow.innerHTML = "Today's date = " + today;
// Use prototype method to add new function to prototype
Date.prototype.addHours = function(h) {
this.setTime(this.getTime() +(h * 60 * 60 * 1000));
return this;
}
function execute(e) {
const a = new Date();
a.addHours(1);
timeAdd.innerHTML = a;
}
button.addEventListener('click',execute)
</script>
</body>
</html>Output :
Before click:
After click:
Summary
In this tutorial, we have explained how we add hours to a date in JavaScript in a manual way. You can use the add method we create in a lot of ways and can also create another method base on the way I guide you.
Maybe you are interested:
- Set the current Date on an Input type=”date” in JavaScript
- Convert a dd/mm/yyyy string to a Date in JavaScript
- Get yesterday’s Date formatted as YYYY-MM-DD in JavaScript
- Get the Sunday of the Current Week using JavaScript
- Format a date as yyyymmdd using javascript
- Format a date as yyyy-mm-dd in javascript
- Initialize a date with time zone using javascript
- Get the current year using javascript
- Convert a date to another time zone using javascript
Hello, guys! I hope that my knowledge in HTML, CSS, JavaScript, TypeScript, NodeJS, ReactJS, MongoDB, Python, MySQL, and npm computer languages may be of use to you. I’m Brent Johnson, a software developer.
Name of the university: HOU
Major: IT
Programming Languages: HTML, CSS, JavaScript, TypeScript, NodeJS, ReactJS, MongoDB, PyThon, MySQL, npm
