The date attribute in the input tag creates a calendar to choose the date, which includes day, month, and year.
Syntax:
<input type = "date">
Example 1: Use date attribute in input tag
html
<!DOCTYPE html>
<html>
<head>
<title>Date Attribute</title>
</head>
<body>
<form action="/">
Date of Birth: <input type="date">
</form>
</body>
</html>
|
Output:
Example 2: Initializing the default date value in input tag. The date format is value = “yyyy-mm-dd” in input tag
html
<html>
<head>
<title>Date Attribute</title>
</head>
<body>
<form action="/">
Date of Birth:
<input type="date"
value="2018-10-19">
</form>
</body>
</html>
|
Output:
Example 3: DOM for date attribute
html
<!DOCTYPE html>
<html>
<head>
<title>Date Attribute</title>
</head>
<body>
Date of Birth:
<input type="date" id="dob">
<button onclick="dateDisplay()">
Submit
</button>
<p id="demo"></p>
<script>
function dateDisplay() {
let x = document.getElementById("dob").value;
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>
|
Output:
Output in the phone:
Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape,
GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out -
check it out now!
Last Updated :
04 Aug, 2023
Like Article
Save Article