Le code suivant figure dans le corps du document : 

<script type="text/javascript">
<form id= 'form_test_id' onsubmit= 'start(); return false;'> <!--  takes the enter key into account for text fields https://javascript.info/forms-submit --> 
<label for= 'date_id'>Date de l'événement: </label><input type= 'date' id= 'date_id' maxlength= '10' required><br>
<br>
<input type= 'button' value= "Démarrer" onclick= 'start();'> <!-- as the form is not processed by a particular URL, it is preferable to use the "button" type rather than the "submit" type which avoids reloading the page --> 
<input type= 'button' value= "Arrêter" onclick= 'stop();'>
</form>
<br>
<span id= 'result_1_id'></span><span id= 'result_2_id'></span>

</script>

Le code suivant figure en bas de page :

<script type="text/javascript">
const result_1= document.getElementById('result_1_id');
const result_2= document.getElementById('result_2_id');
const date= document.getElementById('date_id');
var interval_id;

function check_text(entry) {
	var temp;
	var exp= new RegExp(/^[0-9]{2}\/[0-9]{2}\/[0-9]{4}$/);
	temp= exp.test(entry);
	if (temp == false) { result1.innerHTML= "Date invalide.";}
	return temp;
	}
		
function check_date(year, month, day) {
	var temp;
	var newDate = new Date(year, month-1, day); //  we try to generate the date
	if (newDate.getFullYear()  ==  year && newDate.getMonth()  ==  month-1 && newDate.getDate() == day) { temp= true; }
	else { result1.innerHTML= "Cette date n'existe pas."; temp= false; }
	return temp;
	}
	
function start() {
	var temp;
	var year; var month; var day;
	if (date.type == 'text') {
    	/*
		when the date field is not supported, its type is transformed into text type
		old format dd/mm/yyyy ou dd / mm / yyyy 
        */
		var event_date= date.value.replace(/ /g, '');  // on supprime d'éventuels espaces
		date_valid= check_text(event_date);	
		if (date_valid) {
			temp= event_date.split('/');
			year= temp[2]; month= temp[1]; day= temp[0]; 
			date_valid= check_date(year, month, day);
			}	
		}
	else { 
		/* 
		date.type == 'date'
		new format yyyy-mm-dd
		*/
		temp= date.value.split('-');
		year= temp[0]; month= temp[1]; day= temp[2];
		date_valid= check_date(year, month, day);
		}
	if (date_valid) {
		var now = new Date();
		var event_full_date = new Date(now.getFullYear(), month-1, day-1, 24, 59, 59);
		var wait= countdown(event_full_date);
		if (wait > 0) { 
			interval_id= setInterval(countdown, 1000, event_full_date);
			}
		}
	} 

function countdown(event_full_date) {
	now = new Date();
	var full_seconds= Math.floor((event_full_date.getTime() - now.getTime()) / (1000));
	if (full_seconds <= 0) { result_1.innerHTML= "L'événement est terminé"; }
	else {
		result_1.innerHTML= "L'événement est dans "
		var days= Math.floor(full_seconds / (24 * 60 * 60));
		var hours= Math.floor((full_seconds - (days * 24 * 60 * 60)) / (60 * 60));
		var minutes= Math.floor((full_seconds - (days * 24 * 60 * 60) -  (hours * 60 * 60)) / (60));
		var seconds= Math.floor(full_seconds - (days * 24 * 60 * 60) -  (hours * 60 * 60) - (minutes * 60));
		result_2.innerHTML=  days + " jours, " + hours + " heures, " + minutes + " minutes, " + seconds + " secondes";
		}
	return full_seconds;
	}

function stop() {
	if (interval_id) clearInterval(interval_id);
	}

</script>

Cet exemple reprend des fonctions déjà vues dans la page anniversaire (nouvelle version) tout en calculant la différence de temps en secondes et en réactualisant l'affichage chaque seconde.