11. Date & Time in JavaScript

1. Creating Date Objects

Program 1: Create Date Object (Current Date & Time)

				
					<!DOCTYPE html>
<html>
<body>

<script>
let currentDate = new Date();

document.write("Current Date & Time: " + currentDate);
</script>

</body>
</html>

Program 2: Create Date Using Specific Values

				
					<!DOCTYPE html>
<html>
<body>

<script>
let customDate = new Date(2025, 0, 26); // Year, Month(0-11), Day

document.write("Custom Date: " + customDate);
</script>

</body>
</html>

Program 3: Create Date from String

				
					<!DOCTYPE html>
<html>
<body>

<script>
let dateFromString = new Date("2025-01-26");

document.write("Date from String: " + dateFromString);
</script>

</body>
</html>

2. NaN (Not a Number)

Program 1: Get Individual Date Components (Built-in)

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();

document.write("Year: " + d.getFullYear() + "<br>");
document.write("Month: " + (d.getMonth() + 1) + "<br>");
document.write("Date: " + d.getDate() + "<br>");
document.write("Day: " + d.getDay());
</script>

</body>
</html>

Program 2: Get Time Components (Built-in)

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();

document.write("Hours: " + d.getHours() + "<br>");
document.write("Minutes: " + d.getMinutes() + "<br>");
document.write("Seconds: " + d.getSeconds());
</script>

</body>
</html>

Program 3: Manual Month & Day Name Mapping

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();

let months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun",
              "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];

let days = ["Sunday", "Monday", "Tuesday", "Wednesday",
            "Thursday", "Friday", "Saturday"];

document.write("Month Name: " + months[d.getMonth()] + "<br>");
document.write("Day Name: " + days[d.getDay()]);
</script>

</body>
</html>

3. Setting Date & Time

Program 1: Set Date Using setDate()

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();
d.setDate(15);

document.write("Updated Date: " + d);
</script>

</body>
</html>

Program 2: Set Month and Year

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();
d.setMonth(11);     // December
d.setFullYear(2026);

document.write("Updated Date: " + d);
</script>

</body>
</html>

Program 3: Set Time Values

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();
d.setHours(10);
d.setMinutes(30);
d.setSeconds(0);

document.write("Updated Time: " + d);
</script>

</body>
</html>

Program 4: Manual Date Change Logic (Add Days)

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();
let daysToAdd = 5;

d.setDate(d.getDate() + daysToAdd);

document.write("Date after adding days: " + d);
</script>

</body>
</html>

4. Formatting Date

Program 1: Built-in Date Formatting Methods

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();

document.write("toDateString(): " + d.toDateString() + "<br>");
document.write("toTimeString(): " + d.toTimeString() + "<br>");
document.write("toLocaleDateString(): " + d.toLocaleDateString());
</script>

</body>
</html>

Program 2: Manual Date Format (DD-MM-YYYY)

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();

let day = d.getDate();
let month = d.getMonth() + 1;
let year = d.getFullYear();

document.write("Formatted Date: " + day + "-" + month + "-" + year);
</script>

</body>
</html>

Program 3: Manual Date & Time Format (DD/MM/YYYY HH:MM)

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();

let day = d.getDate();
let month = d.getMonth() + 1;
let year = d.getFullYear();

let hours = d.getHours();
let minutes = d.getMinutes();

document.write("Formatted Date & Time: "
    + day + "/" + month + "/" + year
    + " " + hours + ":" + minutes);
</script>

</body>
</html>

Program 4: Manual Zero Padding (Professional Formatting)

				
					<!DOCTYPE html>
<html>
<body>

<script>
let d = new Date();

let day = String(d.getDate()).padStart(2, "0");
let month = String(d.getMonth() + 1).padStart(2, "0");
let year = d.getFullYear();

document.write("Formatted Date (DD-MM-YYYY): "
    + day + "-" + month + "-" + year);
</script>

</body>
</html>