Contador de días en: Javascript

Es es un ejemplo de script para colocar un contador de días transcurridos entre fechas en una página web, dará como resultado un texto indicando el resultado de contar días que faltan para Navidad (u otra fecha). Se puede usar para cualquier fecha, pero en este ejemplo he usado la del 25 de Diciembre como fecha final

Tienes un proyecto similar de contador regresivo con todo el desarrollo explicado y comenzando desde cero

Solución

<script>

//final: array {dia, mes,año}

function diasHasta(final){

  let Hoy=new Date();

  let fin = new Date(final.año, final.mes, final.dia);

  let mseg_dia=1000*60*60*24;

  let dias ;

  if (Hoy.getMonth()==final.mes && Hoy.getDate()>final.dia) {

      fin.setFullYear(fin.getFullYear()+1) ;

  }

  dias = Math.ceil((fin.getTime()-Hoy.getTime())/(mseg_dia));

  let cuadro=document.getElementById('cuenta');

  cuadro.innerText="Faltan "+dias+" dias hasta "+fin.toLocaleDateString()

}

</script>

<body>

<div id="cuenta"></div>

<script>

diasHasta({año:2024, mes:11, dia:25} )

</script>

</body>

Explicación

Este contador de días es un perfecto ejemplo de uso de las funciones de fecha proporcionadas por el objeto Date de Javascript. Primero declaramos las variables a usar en el script: Hoy para la fecha actual y Nav para la fecha final, en este caso 25 de Dic. Recordemos que para Javascript el mes 0 es Enero y el 11 es Diciembre.

Si estamos despues del 25 de Diciembre, cambiamos Nav a la navidad del año siguiente.

La variable mseg_dia es el número de milisegundos que tiene un día. Para contar los días se restan la fecha objetivo del día actual. Al restar las fechas el resultado sale en milisegundos, para pasarlos a dias hay que dividir por mseg_dia.
Y ya solo queda escribir la frase del contador, por ejemplo que Quedan xx días hasta Navidad.

Como lo uso

El script se puede colocar en cualquier parte entre <body> y </body>, en el lugar donde queramos que aparezca la frase elegida para este contador de días. Se le llama con la sentencia diasHasta({año:2022, mes:11, dia:25} ), El argumento es un objeto con la fecha fnal del contador.

Por cierto por si no lo sabías:

Si quieres ver un ejemplo más elaborado de un contador de días en funcionamiento visita esta   página tipo next open en Creatuweb