|
Hola quetal es este pequeño articulo queria manejar un poco lo que es el manejo de fechas en JavaScript a partir
de ciertos ejemplos utilies. [bien documentados  ]
1. Basicamente el manejo de las fechas en JavaScript esta definido por el uso de la clase Date(), la cual
instaciada por un objeto puede traernos la hora, minutos, segundos, dia de la semana [numero], meses, años....
Esta clase maneja basicamente las siguentes Funciones / Metodos.
Manejo de Fecha
- getDate() --> para obtener el dia con todos los juguetes. [fecha] + hora GTM
- getDay() --> Para obtener el dia de la semana [numero]
- getMonth() --> Para obtener el mes [numero] -- este empieza por cero ya que es un Array
- getYear() --> Para obtener el año Actual restandole 1900 [desde que comenzo]
- getFullYear() --> Para obtener el año Actual en formato AAAA [este es el mas recomendable]
Manejo de Hora
- getHours() --> Para obtener la hora
- getMinutes() --> Para obtener los minutos
- getSeconds() --> Para obtener los segundos
- getTime() --> Para obtener los milisegundos
Bueno basicamente el uso de la clase Date() nos trae eso ... [que chevere]
Ejemplos para el uso de la clase Date()
1. Obtener fecha Normalilla /****
*@Nombre Funcion: mostrarFecha()
*@Descripcion : Esta funcion se encarga de mostrar la fecha en la pagina HTML al ser invocada
***/
function mostrarFecha( ){ //Muestra la fecha
//Esta variable hace una instancia a la funcion Date de JavaScript. A partir de esta se saca la hora y la fecha
var fecha = new Date( );
//Aqui se definen las variables para obtener parte de la fecha
//Primero comenzamos por obtener el año
anoActual = fecha.getYear( );
//Aqui se obtiene el mes
mesActual = fecha.getMonth( );
//Aqui se evalua si el mes el menor de nueve - Si se cumple la condicion se le coloca un cero antes
mesActual = (mesActual < 9)?"0" + mesActual : mesActual;
//Aqui se obtiene el dia
diaActual = fecha.getDate( );
//Aqui se evalua si el dia es menor de nueve - Si se cumple esta condicion se le coloca un cero antes
diaActual = (diaActual < 9)?"0" + diaActual : diaActual;
//Aqui se recoge en un variable todos las segmentos que componen la fecha
fecha = anoActual + "-" + mesActual + "-" + diaActual;
//Aqui se escribe en la pagina la fecha actual
document.write(fecha);
}//Cierra la funcion mostrarFecha 2. Obtener fecha compuesta por los nombres de los dias y los meses del año
/****
*@Nombre Funcion: mostrarFechaCompuesta()
*@Descripcion : Esta funcion muestra la fecha con los nombres de los dias y los meses
***/
function mostrarFechaCompuesta(){ //Muestra la fecha con nombres
//Aqui creamos los arrays que contienen el nombre de la semana y los meses
nombreMes = new Array ("Enero", "Febrero", "Marzo", "Abril", "Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");
nombreDia = new Array ("Domingo","Lunes","Martés","Miércoles","Jueves","Viernes","Sábado","Domingo");
//Esta variable hace una instancia a la funcion Date de JavaScript. A partir de esta se saca la hora y la fecha
fecha = new Date( );
//Aqui se definen las variables para obtener la parte de la fecha
//Aqui se obtiene el año actual
anoActual = fecha.getYear( );
//Aqui se obtiene el mes actual
mesActual = fecha.getMonth( );
//Aqui se obtiene el dia actual
diaActual = fecha.getDate( );
//Aqui se obtiene el dia de la semana
diaSemana = fecha.getDay( );
//Aqui se le da formato a la fecha y se recoge en una sola variable
fecha = nombreDia[diaSemana] + ", " + diaActual + " de " + nombreMes[mesActual] + " de " + anoActual;
//Aqui se escribe en la pagina la fecha actual
document.write(fecha);
}//Cierra la funcion mostrarFechaCompuesta 3. Obtener hora en formato HH:SS:MM ****
*@Nombre Funcion: mostrarHora()
*@Descripcion : Esta funcion se emcarga de mostrar la hora en formato HH:MM:SS
***/
function mostrarHora( ){ //Muestra la hora
//Aqui tomamos la hora y definimos el formato
tiempo = new Date();
//Aqui se obtiene la hora
hora = tiempo.getHours();
//Aqui se obtiene el minuto
minuto = tiempo.getMinutes();
//Aqui se obtien el segundo
segundo = tiempo.getSeconds();
//Aqui se obtiene el estado de la hora
estado = (hora < 12)? " AM " : " PM";
//Aqui se le da formato y toma la hora en una sola variable
horaActual = ((hora < 9)?"0" + hora : hora) + ":";
horaActual += ((minuto < 9)?"0" + minuto : minuto) + ":";
horaActual += (segundo < 9)?"0" + segundo : segundo + estado;
//Aqui se muestra la hora
document.write(horaActual);
}//Cierra la funcion Mostrar hora 4. Obtener hora con el efecto de reloj sobre el contenido HTML /**
* @Nombre Funcion : mostrarHoraCompuesta
* @Descripcion : Esta funcion muestra la hora actualizandose cada segundo
* @Requisitos : Para que esta funcion se ejecute sin problemas requiere de las siguietes funciones.
* - pararTiempo()
* - iniciarTiempo()
* - obtenerHora()
**/
function mostraHoraCompuesta() { //Muestra el reloj
var Hora=obtenerHora( ); // Invoca la funcion que obtiene la hora
// Aqui se muestra la hora en sitios estrategicos de la pagina :P
// Aqui muestra la dentro una capa que contenga como id la referencia horaCompuesta
window.document.getElementById("horaCompuesta").innerHTML= Hora;
//Aqui muestra la hora en la barra de estado
// window.status= Hora;
//Aqui muestra la hora en el titulo
// window.document.title= Hora; //Solo i no hay frames
//Aqui muestra la hora en el titulo
// top.document.title= Hora;//Por si hay frames
//Aqui se le asigna al timerID la funcion setTimeout para que cada segundo/ 1000 milisegundos
//vuelva a mostrar la funcion mostraHoraCompuesta. Aqui es donde se da el efecto xD
setTimeout("mostraHoraCompuesta()",1000);
correrTiempo = true; //Aqui se pone a correr el tiempo :P
}
/****
*@Nombre Funcion: correrTiempo()
*@Descripcion : Esta funcion
***/
//a partir de aqui se ejecuta el codigo que muestra la hora.
var correrTiempo = false; //Flag para saber si el reloj esta activo
function pararTiempo(){ //Para el reloj
if(correrTiempo){
correrTiempo = false;
}//Este cierra el IF
}//Este cierra la funcion
function iniciarTiempo(){// Para el reloj y vuelve a inicarlo
pararTiempo(); //Funcion que detiene el tiempo
mostraHoraCompuesta(); //Funcion que muestra el reloj
}
function obtenerHora( ){
//Aqui tomamos la hora y definimos el formato
tiempo = new Date();
//Aqui se obtiene la hora
hora = tiempo.getHours();
//Aqui se obtiene el minuto
minuto = tiempo.getMinutes();
//Aqui se obtien el segundo
segundo = tiempo.getSeconds();
//Aqui se obtiene el estado de la hora
estado = (hora < 12)? " AM " : " PM";
//Aqui se le da formato y toma la hora en una sola variable
var horaActual = ((hora < 9)?"0" + hora : hora) + ":";
horaActual += ((minuto < 9)?"0" + minuto : minuto) + ":";
horaActual += ((segundo < 9)?"0" + segundo : segundo) + estado;
//Aqui se muestra la hora
return horaActual;
}
<!-- Codigo HTML necesario para ver el efecto -->
Aqui se debe crear un capa que contenga el id relojilloxD :P --> Este nombre se le puede cambiar al ID
de la capa, pero tambien se le debe cambiar al parametro usado en la funcion mostrarHoraCompuesta
<div id="relojilloXd"></div> Bueno aqui hay una muestra de los ejemplos mostrados anteriormente. Podras editar el codigo fuente para ver las funciones que se usan. (Estas de igual forma esta comentarizadas )
Ejemplos de manejo de Fechas en JavaScript |
Programación 
