DOM Calendar
Display dates as specified
- For today's date show
- day of the week in English
- month in English
- day of the week in French
- month in French
The phrase:
let today = new Date()
sets the variable today
to today's date
The function toLocalDateString takes an options object. You can set:
- weekday to
long
short
narrow
- month to
long
short
narrow
- the first parameter can be a language such as "en", "fr", "de", "zh"
let today = new Date(); document.body.innerHTML = ` ${today.toLocaleDateString('en',{weekday:'long'})} <br> ${today.toLocaleDateString('en',{weekday:'short'})} <br> `;
let today = new Date(); document.body.innerHTML = ` ${today.toLocaleDateString('en',{weekday:'long'})} <br> ${today.toLocaleDateString('en',{month:'long'})} <br> ${today.toLocaleDateString('fr',{weekday:'long'})} <br> ${today.toLocaleDateString('fr',{month:'long'})} <br> `;
Show 7 days from now
let n = new Date().getTime(); for(let i=-3; i<3; i++){ let dy = new Date(n + 1000*60*60*24*i); let d = document.createElement('div'); d.innerHTML = dy.toLocaleDateString('en',{day:'2-digit',month:'short'}); document.body.append(d); }
let n = new Date().getTime(); for(let i=0; i<7; i++){ let dy = new Date(n + 1000*60*60*24*i); let d = document.createElement('div'); d.innerHTML = dy.toLocaleDateString('en',{day:'2-digit',month:'short'}); document.body.append(d); }
Show 7 days from the first of this month
You can find the first of this month...
- Get today's date
- Use setDate(1) to set the day of the month
let first = new Date(); first.setDate(1); let n = first.getTime(); for(let i=-3; i<3; i++){ let dy = new Date(n + 1000*60*60*24*i); let d = document.createElement('div'); d.innerHTML = dy.toLocaleDateString('en',{day:'2-digit',month:'short'}); document.body.append(d); }
let n = new Date().getTime(); for(let i=0; i<7; i++){ let dy = new Date(n + 1000*60*60*24*i); let d = document.createElement('div'); d.innerHTML = dy.toLocaleDateString('en',{day:'2-digit',month:'short'}); document.body.append(d); }