El Calendario y JavaScript
Si buscamos incorporar la visualización del mes actual en nuestra página web, JavaScript es sin duda alguna, una herramienta imprescindible que podemos utilizar para lograr esto. Este lenguaje de programación permite a los desarrolladores manipular de manera dinámica los elementos de la página web, incluyendo, por supuesto, la información relacionada con las fechas y los tiempos.
Usando JavaScript para Mostrar el Mes Actual
Para mostrar el mes actual del calendario, JavaScript nos proporciona el método getMonth() del objeto Date. Este método retorna el mes del año para la fecha especificada de acuerdo al horario local, indexado desde 0 (donde 0 corresponde a Enero, 1 a Febrero, …, 11 a Diciembre).
El fragmento de código a continuación muestra cómo usar el método getMonth() para obtener el número del mes actual.
var fecha = new Date(); var mes = fecha.getMonth();
Este fragmento de código crea un objeto Date que guarda la fecha y la hora actuales. Luego, extrae el número del mes usando getMonth().
Formatear el Resultado para Mostrar el Mes en Formato Texto
Visualizar el mes en formato texto hará que la información sea más legible para los usuarios. Para ello, podemos crear un array que almacene los nombres de los meses y luego usar el resultado del método getMonth() como índice para este array.
var meses = ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"]; var fecha = new Date(); var mes = fecha.getMonth(); document.write("Este es el mes de: " + meses[mes]);
Este fragmento de código recibe el mes como un número entre 0 y 11, y luego recupera y muestra el nombre correspondiente del array meses.
Actualizando el Mes dinámicamente
Si queremos que la página se actualice automáticamente al cambiar de mes, deberíamos implementar un intervalo de actualización mediante la función setInterval(). La función setInterval() llama a una función o evalúa una expresión a intervalos especificados (en milisegundos).
var meses = ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"]; function mostrarMes() { var fecha = new Date(); var mes = fecha.getMonth(); document.write("Este es el mes de: " + meses[mes]); } setInterval(mostrarMes, 3600000);
En este último fragmento de código, se actualizan automáticamente los cambios de mes. La función setInterval() se encargará de este trabajo, invocando la función mostrarMes() cada 3600000 milisegundos, que es lo mismo que una hora.