SELECCIONAR TEXTO DE UN TEXTBOX

Para que el contenido de un textbox quede seleccionado al dar click sobre el, deveremos poner en el evento GotFocus las siguientes lineas:

Código:

Text2.SelStart = 0
Text2.SelLength = Len(Text2.Text)

Buscar un elemento en un arreglo con JS

Existe en php una funcion que nos permite buscar un elemento en un arreglo, sin embargo a la hora de querer realizar esto en js nos encontramos con que no hay un metodo parecido, ya se que es facil implementar esta funcion y san se acabo sin mas escandalo, sin embargo lo interesante que les voy a comentar es como hacerlo a traves de prototype ya se que no es nada del otro mundo pero puede que muchos no lo conozcan y creanme es una gran herramienta.

Prototype es un procedimiento que nos permite agregarle metodos a nuestros objetos y claro que esto tambien aplica a objetos tales como document, array, navigator etc, y ahi es donde radica su importancia, con esto podemos crear una libreria con los metodos mas utiles propios de otros lenguajes y que no hallan su equivalente en javaScript.
Veamos entonces como podemos hacer dicha implementacion:

Array.prototype.in_array = function(p_val) {
for(var i = 0, l = this.length; i <>
if(this[i] == p_val) {
return true;
}
}
return false;
}//fin de la inclusion


Observemos ahora:
En:Array.prototype.in_array = function(p_val) {
Primero seleccionamos en que objeto vamos a integrar el nuevo metodo, en este caso es sobre el objeto Array despues ponemos la palabra prototype que indica que lo que vamos a hacer es agregar un nuevo metodo sobre el objeto array, a continuación declaramos en nombre del nuevo metodo, este puede ser cualquiera solo hay que asegurarnos de que sea intuitivo y facil de recordar ;), en este caso le pusimos in_array, posteriormente declaramos una funcion donde podremos poner todos los parametros que decidamos admitir y finalmente creamos el cuerpo de nuestra funcion como si se tratara de cualquier otra.


Lo que hacemos a continuacion es facil de deducir, creamos un ciclo e inicializamos dos variables una con 0 y la otra con el valor de la longitud del arreglo, despues hacemos un recorrido por el arreglo buscando en cada celda si su contenido es igual a la palabra, numero o caracter buscado, en este caso dicho caracter nos llega en forma de parametro y lo recibe la variable p_val si el caracter es encontrado regresamos verdadero sin embargo si termina de recorrer todo el arreglo sin encontrar el caracter simplemente nos regresa un falso.

for(var i = 0, l = this.length; i <>
if(this[i] == p_val) {
return true; }
}
return false;

Para finalizar provamos nuestro metodo creando una variable tipo arreglo y haciendo una busqueda , si observamos bien la forma de llamar a estos metodos es poniendo el nombre de la variable seguido de un punto y el nombre de nuestro metodo seguido de sus parametros en caso de que los halla.

var v_array = [ 5, 10, 15, 20, 25];
document.writeln(v_array.in_array(10)); // true
document.writeln(v_array.in_array(11)); // false

Validaciones js ejemplos

Bueno hace un momento me vino la idea de hacer una serie de post bajo la etiqueta repositorios donde voy a ir poniendo el codigo mas util y repetitivo que voy utilizando, todo listo para un copiar y pegar y ahorrarnos asi un poco de tiempo.

En este post no pretendo mucho solamente mostrar el codigo de las validaciones que mas frecuentemente uso, no son muchas pero sirven de vez en vez para todos esos que son = de flojos que yo y no nos gusta estar reescribiendo la validacion en cada proyecto, ya que se hizo una vez un copy page siempre es mejor =P.

//er_nombre se encargara de validar todos los campos que hagan referencia a nombre y apellidos, solo aceptara letras y tendra una longitud maxima de 25 caracteres.

var er_nombre=/^[a-zA-ZñÑ]([ñÑa-zA-Z\s]{0,24})$/;

var er_expediente=/^([0-9]{3}\/[0-9]{4})$/ //esta expresion se encarga de evaluar el numero de expediente el cual acepta solo numeros y tiene una longitud de 7 caracteres 3 numeros, barra, 4 numeros "123/2000"


var er_texto=/^((.|\n){0,500})$/ //se encarga de validar que todos los textos libres no rebasen una longitud de 500 caracteres, acepta cualquier caracter.


var er_dinero=/^([0-9]{0,10})$///evalua que la cadena solo tenga numeros de una longitud no mayor a 10 caracteres

var er_fechaa=/^([0-9]{4})[\/-]([01][0-9])[\/-]([0123][0-9])$/ //para la validacion e fechas

//zona de funciones: evalua el campo correspondiente si el campo no tiene el formato deseado entra a la condicion que manda una alerta y regresa un valor de false caso contrario regresa true.

function nombre(nom,campo){
if (!er_nombre.test(nom)){alert(campo+" no valido");return false;}else return true;
}


function expedient(num){
if(!er_expediente.test(num)){alert (num+": Expediente no valido"); return false;}else return true;
}


function texto(text,campo){
if(!er_texto.test(text)){alert(campo+" no valido"); return false;}else return true;
}


function dinero(cant){
if(!er_dinero.test(cant)){alert ("monto no valido");return false;}else return true;
}


function fechaa(f,tipo){
if(!er_fechaa.test(f)){alert (tipo+" no valida");return false;}else return true;
}

Mas Validaciones:

//sirve para validar que se introduscan solo 13 digitos para el rfc

if (!(/^[A-Za-z]([A-Za-z]{3}[0-9]{5})[0-9]$/).test(objeto.rfc.value)){
alert ("Error de logeo\nEl RFC es incorrecto!!!, recuerde que son 4 letras y 6 digitos\nPara mayor informacion pulse el icono \" i \" de la parte superior");
return false;
}//fin del if

---

//sirve para validar que la contraseña no contenga caracteres en blanco o este vacia

if((/\s/).test(objeto.password.value)|| (objeto.password.value=="")){
alert ("Error de logeo\nEl password es incorrecto!!!\nRecuerde que no debe de contener espacios y no debe de quedar en blanco");
return false;
}//fin del if

Problemas con la ñ y acentos en javaScript

Algunas veces al momento de trabajar con javaScript nos encontramos con que no reconoce los caracteres acentuados o las letras ñ, muchas veces ni cuenta nos damos de que ese error esta latente solo hasta cuando probamos nuestra aplicacion, puede ser que no le demos mucha importancia a esto (y dependiendo para que utilicemos js puede que no la tenga), sin embargo si realizamos las validaciones de nuestro sitio con js puede que este error se convierta en una lata, asi que aqui hay algunas recomendaciones para solucionar este problema.

Casos de error

1) Regularmente con la codificacion utf-8 no debe de haber ningun problema (si no sabes que codificacion tienen tus paginas busca la palabra charset que se encuentra dentro de la etiqueta meta) sin embargo si es asi recomiendo que uses la codificacion española, observa la siguiente linea y prueba si el problema esta solucionado.

< meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
o bien
< meta http-equiv="content-type" content="text/html; charset=es-iso-8859-1" />

el charset debe de ser iso-8859-1 o es-iso-8859-1 que es la codificacion española, con esto en las expresiones regulares ya no tendremos problemas de validar las ñ's.


2) Bueno esta mas que ser la solucion 2 es una extencion de la primera, una vez que cambiamos el charset si estamos interactuando con una base de datos por ejemplo MySQL puede que hallamos observado que los acentos y palabras con ñ simplemente no los guarda, entonces diremos bonita solucion, me arregla un lado pero me descompone otro :P, bueno esto pasa por que sinos fijamos bien en la estructura de nuestra tabla veremos que en la columna cotejamiento tenemos definida la codificacion estandar utf y como ahora estamos usando una codificacion diferente, es logico que la base de datos no guarde la informacion de la manera que es debido, esto se soluciona facilmente cambiando el cotejamiento a uno compatible con nuestro tipo de codificacion, normalmente es un tipo spain o un tipo latin :)

3) Como habia comentado, es raro que la codificacion utf-8 nos de problemas, pero se puede dar la situacion de que la codificacion no sea el problema si no la incompatibilidad entre codificaciones, me explico, a mi me paso lo siguiente:

Tenia un archivo js externo y mi codificacion de paginas era la estandar es decir utf-8, al checar otras paginas en las que usaba expresiones regulares con la misma codificacion, note que no tenia ningun problema con la "ñ" sin embargo en esa pagina donde la evaluacion de los campos se hacia en el archivo externo simplemente no reconocia la ñ como caracter aunque la incluyera explicitamente (que es lo que hay que hacer) en mi expresion regular, no daba con el por que hasta que me di cuenta que como el archivo externo lo habia generado con el blog de notas de windows (de una u otra forma simpre windows tiene la culpa :P broma - broma fue mi estupidez)

la codificacion del documento habia sido Unicode en vez de utf-8 lo que hice a continuacion fue cambiar la codificacion de la pagina (eso es un decir por que la verdad cree un nuevo archivo que guarde con codificacion utf-8 e hice un copy - paste de mi archivo original al nuevo :D) y con esto como por arte de magia se soluciono el problema :), verifiquen esto por que puede que ahi radique el error.

4) De echo esta solucion debio de ir como numero 1, sin embargo no me acorde hasta que estaba escribiendo el punto anterior, como mencione si usamos expresiones regulares para validar campos una expresion comun es hacer que el campo solo acepte letras eso seria mas o menos algo asi: /^[a-zA-Z]$/ y listo, sin embargo la "ñ" como muchos sabemos no forma parte del alfabeto americano, britanico etc, etc por lo que hay que agregar esta letra de forma explicita, haciendo: /^[a-zA-Z ñ Ñ]$/ y con esto tendremos solucionado el problema, independientemente de las soluciones anteriormente vistas, esta es una correccion que por default debera ir para que mi expresion acepte ñ's perdon por ponerla hasta este punto :P que quieren se me paso :).

como nota: Aunque por deduccion ya lo debieron de haber supuesto(redundate, reundate :P), para los acentos es igual es decir deberan agregarlos explicitamente /^[a-zA-Z ñ Ñ á Á éÉ íÍ óÓ úÚ]$/ traten de intentar esta solucion antes que las anteriores y espero que con esto quede todo resuelto :).

5) Este es el ultimo punto y mas que una solucion es un truco muy util para estos problemas de codificacion, sin embargo alejandonos un poco del titulo, este es un truco para php, que por medio de la funcion mb_convert_encoding es capaz de cambiar la codificacion de los caracteres de un bloque de texto determinado:

$tex = mb_convert_encoding($texto, “ISO-8859-1?, “UTF-8?);

o bien

$tex = mb_convert_encoding("Ñoño nuñes tiene gripíta", “ISO-8859-1?, “UTF-8?);

Bueno es todo en este post espero que alguna de estas soluciones les sirva. =)

Referencia de eventos en JS

Ya se que existen muchas tablitas parecidas a esta, peroyo tambien quiero tener la mia asi que ahi va:

Evento	Tiene efecto sobre	Sucede cuando	Manejador
Abort	imágenes	El usuario cancela la carga de una imagen	onAbort
DblClick	Enlaces,Botones	El usuario hace doble click sobre el objeto	onDblClick
DragDrop	Ventanas	El usuario suelta un objeto sobre la ventana del navegador	onDragDrop
Blur	ventanas y elementos de formularios	El usuario abandona la ventana o elemento (pierde el foco)	onBlur
Change	text fields, textareas, select lists	El usuario cambia el valor de un elemento	onChange
Click	buttons, radio buttons, checkboxes, submit buttons, reset buttons, links	El usuario pulsa sobre el elemento o el enlace	onClick
Error	images, windows	La carga de la ventana o la imagen causa un error	onError
Focus	windows and all form elements	El usuario pasa el control (foco) a un elemento determinado	onFocus
KeyDown	documents, images, links, text areas	El usuario pulsa una tecla	onKeyDown
KeyPress	documents, images, links, text areas	El usuario da una pulsación con una tecla o la mantiene pulsada	onKeyPress
KeyUp	documents, images, links, text areas	El usuario deja de pulsar una tecla	onKeyUp
Load	document, body	El usuario carga una página en el navegador	onLoad
MouseDown	documents, buttons, links	El usuario pulsa una tecla del ratón	onMouseDown
MouseMove		El usuario mueve el ratón	onMouseMove
MouseOut	areas, links	El usuario mueve el cursor fuera del elemento	onMouseOut
MouseOver	links	El usuario mueve el cursor dentro del elemento	onMouseOver
MouseUp	documents, buttons, links	El usuario deja de pulsar una tecla del ratón	onMouseUp
Move	windows	El usuario (o algún script) mueve una ventana	onMove
Reset	forms	El usuario pulsa el botón de reset	onReset
Resize	windows	El usuario (o algún script) redimensiona la ventana del navegador	onResize
Select	text fields, textareas	El usuario selecciona el contenido de los elementos del formulario	onSelect
Submit	forms	El usuario pulsa el botón para enviar un formulario	onSubmit
Unload	document body	El usuario sale de la página (carga otra página o cierra esa ventana del navegador)	onUnload

Incremento de fechas con js y php

Ya se que eh hablado mucho sobre manejo de fechas en js pero este post es a peticion de un amigo y nos plantea un problema muy especifico y que a su ves es muy comun en cierto tipo de desarrollos.

Supongamos que en un sitio debemos manejar dos fechas para un proceso x, la fecha de inicio y la fecha final o limite, la situacion es que una vez establecida la fecha de inicio, automaticamente aparesca la fecha limite que es igua a fecha de inicio + 10 dias habiles, es decir los sabados y domingos no cuentan, bueno pues esto es muy facil de resolver, apoyandonos de la libreria DateJS (si no sabes nada de esta libreria presiona aqui)aunque tambien lo podriamos hacer sin ningun problema con el JS tradicional, esta libreria nos hara mas facil el trabajo. Pues bien lo unico que hay que hacer es insertar la libreria DateJS y crear una funcion como la siguiente:

function aumento_fecha(){

//incremento de diez dias en la fecha

var vjafecha=document.formulario.fecha.value;//obtenemos la fecha de inicio que es regularmente la fecha actual.

var dias=10;// # Dias que se deben incrementar

var nvafecha=Date.parse(vjafecha);//pasando la fecha de inicio leida a un objeto tipo date

var sabDom=0;//numero de sabados y domingos que hay en el rango


for (n=1;n<=dias;n++){//hacemos un ciclo para aumentar los 10 dias

if(nvafecha.is().saturday()|nvafecha.is().sunday()) sabDom=sabDom+1;//preguntamos si el dia es sabado o domingo

nvafecha.addDays(1);//nos pasamos al dia siguiente

}

nvafecha.addDays(sabDom);//aumentamos el # de sabados y domingos encontrados

document.nuevo_ja.f_limite.value=nvafecha.toString('yyyy-MM-dd');//imprimiendo fecha final con el formato año-mes-dia en el textbox f_limite del documento
}

Una vez creada la funcion la mandamos llamar ya sea en la carga del body onload="aumento_fecha" o cuando la caja de texto de fecha inicial pierda el foco o cuando la de fechalimite obtenga el foco etc.

Claro??? espero que si, secillo??? sin duda alguna pero eso si muy eficaz ;)

Pero no nos detengamos aqui, supongamos ahora y como es natural que los dias feriados tambien son tomados como dias inhabiles y por lo tanto deben ser ignorados en el incremento de los 10 dias, una forma sencilla de hacer esto es almacenando esos dias en una base de datos, para la siguiente solucion se tomo en cuenta que en una base existe un campo para cada mes del año en el cual se encuentran los dias inhabiles separados con comas, de la siguiente manera:
enero -> 1,5,12
febrero-> 10, 23, 28
etc.

Tomando en cuenta estas consideraciones, una de las soluciones que podemos poner en pratica es la siguiente:

Exelente calendario

Unobtrusive Date-Picker Widget Update, es el nombre de uno de los mejores, mas completos y adaptables caledarios que eh encontrado, esta basado en la union de javaScript con estilos css lo que nos da en conjunto un poderoso calendario cargado con un batallon de utiles funciones y con un diseño sobrio que a su vez es facilmente modificable (bueno para todos aquellos que sepan un poquito de css), la insercion de este calendario a nuestras paginas es facil, solo hay que agregar el script y las direcciones de las hojas de estilo:

Agregando el script

<script type="text/javascript" src="./Scripts/datepicker.js">alert ("Error en la carga del calendario datapicker.js");</script>

Agregando los estilos del calendario

<link href="./hojas_css/demo.css" rel="stylesheet" type="text/css" />

<link href="./hojas_css/datepicker.css" rel="stylesheet" type="text/css" />

Una vez cargados estos archivos (como siempre generalmente el codigo anterior va en la cabecera, por nada personal si no como una buena practica de programacion) lo unico que hay que hacer es agregar una clase css a nuestro elemento en cuestion (regularmente un textbox) con los parametros del tipo de calendario que deseamos generar.

<input name="fecha" type="text" class="format-y-m-d highlight-days-67 range-low-today" id="f_limite" size="10"/>

Bueno esto es solo un ejemplo de lo rapido que pueden integrar este calendario a sus paginas web, para mas informacion presionen aqui iran directamente a la pagina oficial y ahi encontraran tutoriales, descargas y muchos ejemplos.

Para ver mas ejemplos de este calendario presiona aqui

Para Descargar el script presiona aqui

nota de desarrollo: Al momento de integrar el calendario data piker a nuestra pagina, si ponemos el css demo observaremos que obviamente nos altera nuestro propio css y si lo quitamos, el calendario sale demasiado grande, lo que hace limitar el tamaño del calendario, es el tamaño de la letra declarado en body de la css demo, por lo consiguiente si unicamente ponemos font-size:12px; en el body de nuestro css, el calendario tomara un tamaño pequeño sin tener que agregar el estilo demo.css que nos afectaria a nuestro propio estilo. :)

MANEJO DE FECHAS EN JAVA SCRIPT parte 2

- ¿Por fin vas a continuar enseñandome sobre el manejo de fechas en JS?

si, si ya se que me tarde un poco pero seguro que esto te gustara

-¿Pues haber porque la verdad ya me acostumbre a manejar las fechas como me habias enseñado?

me alegra mucho eso quiere decir que si le entendiste a la primera parte pero ahora esto que te voy a enseñar es mucho mas facil de manejar, sin embargo en

situaciones que no requieras hacer demasiadas operaciones con tus fechas recomiendo que uses la forma que ya te enseñe, ya que lo que vamos a ver ahora es

una libreria que se llama DateJS y como tal tiene muchas funciones que puede que jamas lleguemos a usar por lo que solamente agregarias peso muerto a tu

sistema, sin embargo es deciciontuya al fin de cuentas.

- ok, ok ya te entendi pero no has echo mas que acrecentar mi curisidad haber dime de una vez ¿que es datejs?

Tranquilo ya te lo habia dicho DateJS es una libreria que permite manipular fechas en Java Script de una manera muy sencilla

- Ahhhh ¿ Y como se usa?

Bueno en realidad es muy facil de utilizar no tiene la gran ciencia, primero debes de bajar el archivo js que se encuentra en la siguiente direccion:
http://code.google.com/p/datejs/downloads/list

- ¿Oye ya me conecte pero ahí hay dos archivos cual descargo?

Ah si mira si eres un poco observador uno es el archivo con extension js y otro tiene la extencion zip, pues bien el primero es la libreria DateJS esta

libreria es tal cual la programaron y se puede utilizar sin ningun problema, sin embargo para acceder a sus metodos se hara en ingles p.e

Date.today().next().friday() esto desde luego no es un gran problema de ninguna manera sin embargo desarrolladores del mundo al ver la gran potencia y

sencillez de esta libreria acomodaron unos archivos complementarios para que fuera posible llamar a los metodos desde nuestro propio lenguaje, todos esos

archivos de idiomas se encuentran en la version full de la libreria es decir el archivo .zip de esta manera se hace posible definiendo primero el idioma a

utilizar, que con esta libreria podamos hacer algo como: Date.hoy().siguiente().viernes(), pero para esto deberas ver especificamente la traduccion de los

metodos a tu idioma, sin embargo yo te recomiendo usar la libreria en su lengua original, es decir el ingles y no creo que encuentras ningun problema al

implementarla.

-Ahhhh oye eso esta interesante pero apesar de tus recomendaciones como que si tengo ganas de probar el paquete de idiomas

jajajaja, claro esa es la actitud no te limites por loque te digan y si tienes tiempo y ganas echale un vistaso.

- claro que lo hare pero sigueme contando ¿como utilizo esta libreria?

ok, sigo entonces, bueno ahora que ya tienes conocimiento del paquete de idiomas y como te veo con ganas de probarlo te mostrare como hacerle:

* primero buscas en los archivos el nombre valga la redundancia del archivo que corresponda a tu idioma.
* despues de localizarlo debes de hacer algo como las siguientes declaraciones:
en-US [English (United States)]


en-US [English (United States)]


de-DE [German (Germany)]


fr-FR [French (France)]


- Ahhhh creo que si te entiendo, oye pero en caso de que quiera dejarlo con el idioma por defecto ¿ como le hago?
Ahhh oki pues eso es mucho mas facil, simplemente quita la linea de idioma y deja la linea donde agregas el script de JS, el nombre del script claro esta es

el nombre del script por defecto que descargaste, para que me entiendas lo unico que debes de hacer es agregar la siguiente linea:



y simplemente con esto ya podras comenzar a utilizar los metodos de esta libreria, aunque es obvio no esta de mas comentar que es preferible que esta linea

se declare en la cabecera del documento html, php, etc y dicha declaracion debera de ir en cada una de las paginas donde requieras utilizar esta libreria.


- oki, hasta aqui todo claro como el agua del mar muerto, pero sigue por favor que esto cada vez se pone mas interesante

Bene, bene si estas tan ansioso por seguir aprendiendo entonces entremos a la parte medular del asunto.
Aqui unos ejemplos de como usar las sentencias:

// La fecha de hoy
Date.today();

// Agregarle 5 dias a la fecha actual
Date.today().add(5).days();

// Establecer el viernes de esta semana
Date.friday();

// Poner en marzo de este año
Date.march();

// Hoy es viernes?
Date.today().is().friday(); // regresa true|false

// Que dia es hoy?
Date.today().getDayName();

// ¿Qué fecha es el próximo jueves?
Date.today().next().thursday();

// Añadir 3 días a la fecha de hoy
Date.today().add(3).days();

// Hace tres días
(3).days().ago();

// Dentro de 6 meses
var n = 6;
n.months().fromNow();

// Ponerlo a las 8:30 AM del día 15 de este mes
Date.today().set({ day: 15, hour: 8, mintue: 30 });

// Convertir un texto a una fecha
Date.parse(‘today’);
Date.parse(‘t + 5 d’); // hoy + 5 días
Date.parse(‘next thursday’);
Date.parse(‘February 20th 1973);
Date.parse(‘Thu, 1 July 2004 22:30:00);



- Ah orale esto esta interesante, creo que vamos por buen camino esta muy facil asi que no te detengas y enseñame mas

Calma, calma dame un respirito jejejeje, Ahhhhhhh
Bien continuemos, aqui mas ejemplos de lo que podemos hacer con esta libreria, ya que los acoples a lo que necesitas dependera de ti :)
Poner la fecha del primer lunes del año
Date.january().first().monday()


Poner la fecha del ultimo viernes del año
Date.dec().final().friday()

Pon atencion por que el siguiente ejemplo es un poco complicado:
- Ok listo dispara!!!!
jejeje ya voy :)

Poner en el objeto como fecha el 15 del presente mes con una hora de 4:30, posteriormente sumarle 90 dias y asegurarnos que el dia sea un fin de semana, si

no movernos al siguiente fin de semana.

var d1 = Date.today() // creando variable tipo date
.set({ day: 15, hour: 16, minute: 30 }) //estableciendo fecha y hora
.add({ days: 90 })// aumentar 90 dias a la fecha actual
if (!d1.isWeekday()) {
d1.next().monday();
}


- Ahhh que interesante esta heramienta si es buena

Si y toda via falta un poco mas, ya que tambien podemos pasar cadenas de texto como parametro y la libreria interpretara la cadena

-mmmm no te entiendo muy bien
ok, mejor mira estos ejemplos y seguramente entenderas a lo que me refiero



Date.parse(‘today’);


Date.parse(‘tomorrow’);


Date.parse(‘July 8');


Date.parse(‘July 8th, 2007');


Date.parse(‘July 8th, 2007, 10:30 PM’);

Si es un dia diferente al lunes irnos al ultimo lunes
var d1 = Date.parse(‘8-Jul-2007');
if (!d1.is().monday()) {
d1.last().monday();
}
alert(d1.toString(‘dddd, MMMM d, yyyy’));

- Oye que padre creo que ahora si estoy listo para utilizar esta libreria
Me alegro mucho y ya no queda mas que te pongas a trabajar para que le agarres el truco, antes de irme aqui te dejo un poco mas de informacion que te puede ser util:

// avanzar 3 dias apartir de hoy
(3).days().fromNow();

// retorceder 6 meses
(6).months().ago();

// 12 semanas apartir de hoy
var n = 12;
n.weeks().fromNow();

// Avanzar 30 dias apartir de una fecha dada
var d1 = Date.parse(‘07.15.2007');
var d2 = (30).days().after(d1);

mas ejemplos:

Date.today() // Returns today's date, with time set to 00:00 (start of day).

Date.today().next().friday() // Returns the date of the next Friday.
Date.today().last().monday() // Returns the date of the previous Monday.

new Date().next().march() // Returns the date of the next March.
new Date().last().week() // Returns the date one week ago.

Date.today().is().friday() // Returns true|false if the day-of-week matches.
Date.today().is().fri() // Abbreviated day names.

Date.today().is().november() // Month names.
Date.today().is().nov() // Abbreviated month names.

Date.today().is().weekday() // Is today a weekday?

Date.today().addDays(1) // Add one day (+1).
Date.today().addMonths(-3) // Subtract three months (-3).

Date.today().add(1).day() // Add one (+1) day. Supports all date parts (year, month, day, hour, minute, second, millisecond, and weeks)
Date.today().add(-3).months() // Subtract three (-3) months.

(1).day().fromNow() // One (1) day from now.
(3).months().ago() // Three (3) months ago.

var n = 6;
n.months().fromNow() // Six (6) months from now.

Date.monday() // Returns Monday of the current week.
Date.mon() // Abbreviated version of Date.monday()

Date.march() // Returns March 1st of this year.
Date.mar() // Abbreviated version of Date.march()

Date.today().first().thursday() // Returns the first Thursday of the current month.
Date.today().second().thursday()// Returns the second Thursday of the current month.

Date.march().third().thursday() // Returns the third Thursday in March of the current year.
Date.october().fourth().sunday()// Returns the fourth Sunday in October.

Date.today().fifth().sunday() // Returns the fifth Sunday in the current month, or throws a RangeError exception if there are not 5 Sundays in the current

month.
Date.october().final().sunday() // Returns the final Sunday in October.

Date.january().first().monday() // Returns the first Monday of the current year.
Date.december().final().friday()// Returns the last Friday of the current year.

Date.today().at("6:15pm"); // Returns todays date at 6:15pm.

var time = {hour:18, minute:15};
Date.today().at(time); // Set time with a config object.

var birthDayParty = {month: 1, day: 20, hour: 20, minute: 30};
Date.today().set(birthDayParty);// Set date and time with a config object.

CADENAS QUE PUEDEN SER INTERPRETADAS COMO FECHAS

Date.parse('t') // Returns today's date.
Date.parse('today') // Returns today's date.
Date.parse('tomorrow') // Returns tomorrow's date.
Date.parse('yesterday') // Returns yesterday's date.

Date.parse('next friday') // Returns the date of the next Friday.
Date.parse('last monday') // Returns the date of the previous Monday.

Date.parse('July 8th, 2004') // Thu Jul 08 2004
Date.parse('15-Jan-2004') // Thu Jan 15 2004

Date.parse('7/1/2004') // Thu Jul 01 2004
Date.parse('7.1.2004') // Thu Jul 01 2004
Date.parse('07.15.04') // Thu Jul 15 2004

Date.parse('July 23rd 2004') // Fri Jul 23 2004
Date.parse('Sat July 3, 2004') // Sat Jul 03 2004

Date.parse('10:30 PM EST') // Wed Oct 31 2007 20:30:00
Date.parse('10PM') // Wed Oct 31 2007 22:00:00

Date.parse('t + 5d') // Adds 5 days to today.
Date.parse('today - 1 month') // Subtracts 1 month from today.

Date.parse('+') // Add 1 day to today = tomorrow.
Date.parse('- 3months') // Subtract 3 months.

Date.parse('+1year') // Add a year to today.
Date.parse('-12 months') // Subtract 12 months (1 year) from today.

Date.parse('July 4th') // July 4th of this year.
Date.parse('15') // 15th day of current month/year.

Date.parse('July 8th, 2004, 10:30 PM') // Thu Jul 08 2004 22:30:00
Date.parse('2004-07-15T06:45:00') // Thu Jul 15 2004 06:45:00
Date.parse('Thu, 1 July 2004 22:30:00 GMT') // Thu Jul 01 2004 16:30:00

Date.parse('1997-07-16T19:20:15') // ISO 8601 Formats
Date.parse('1997-07-16T19:20:30+01:00') // ISO 8601 with Timezone offset
Date.parse('1985-04-12T23:20:50Z') // RFC 3339 Formats

METODOS DE CAMBIO DE INFORMACION

Date.today().add({ months: 1, days: 5 }).is().fri() // Add 1 month and 5 days, then check if that date is a Friday.

Date.parse('10-July-2004').next().friday().add(-1).month() // Take in a date, then move to the next Friday and subtract a month.

METODOS DE COMPARACION

Date.today().equals( Date.parse('today')) // true|false
Date.parse('last Tues').equals(Date.today()) // true|false

Date.equals(Date.today(), Date.parse('today')) // true|false
Date.compare(Date.today(), Date.parse('today')) // 1 = greater, -1 = less than,

Date.today().compareTo(Date.parse('yesterday')) // 1 = greater, -1 = less than, 0 = equal
Date.today().between(startDate, endDate) // true|false

FORMATO EN FECHAS

new Date().toString() // "Wed Oct 31 2007 16:18:10 GMT-0700 (Pacfic Daylight Time)"
new Date().toString('M/d/yyyy') // "10/31/2007"

Date.today().toString('d-MMM-yyyy') // "31-Oct-2007"
new Date().toString('HH:mm') // "16:18"

Date.today().toString('MMMM dS, yyyy') // "April 12th, 2008"

Date.today().toShortDateString() // "10/31/2007". Culture specific as per Date.CultureInfo.shortDatePattern.
Date.today().toLongDateString() // "Wednesday, October 31, 2007". Culture specific as per Date.CultureInfo.longDatePattern.

new Date().toShortTimeString() // "4:18 PM". Culture specific as per Date.CultureInfo.shortTimePattern.
new Date().toLongTimeString() // "4:18:34 PM". Culture specific as per Date.CultureInfo.longTimePattern.

OTROS METODOS

Date.today().set({ day: 15 }) // Sets the day to the 15th of the current month and year. Other object values include

year|month|day|hour|minute|second.

Date.today().set({ year: 2007, month: 1, day: 20 })


Date.today().add({ days: 2 }) // Adds 2 days to the Date. Other object values include year|month|day|hour|minute|second.

Date.today().add({ years: -1, months: 6, hours: 3 })


Date.today().addYears(1) // Add 1 year.
Date.today().addMonths(-2) // Subtract 2 months.
Date.today().addWeeks(1) // Add 1 week
Date.today().addHours(6) // Add 6 hours.
Date.today().addMinutes(-30) // Subtract 30 minutes
Date.today().addSeconds(15) // Add 15 seconds.
Date.today().addMilliseconds(200) // Add 200 milliseconds.

Date.today().moveToFirstDayOfMonth() // Returns the first day of the current month.
Date.today().moveToLastDayOfMonth() // Returns the last day of the current month.

new Date().clearTime() // Sets the time to 00:00 (start of the day).
Date.today().setTimeToNow() // Resets the time to the current time (now). The functional opposite of .clearTime()
Date.getMonthNumberFromName('March') // 2 - CultureInfo specific.
Date.getDayNumberFromName('sat') // 6 - CultureInfo specific.

Date.isLeapYear(2008) // true|false.
Date.getDaysInMonth(2007, 9) // 31

Date.today().getWeek() // Returns week of year. Returns 1 to (52 | 53) depending on the year
Date.today().setWeek(1) // Sets the week of the year to the Monday of the week set.

var test = new Date(); // Do something... like run a test...
test.getElapsed() // Returns millisecond difference from now.

Date.today().isDaylightSavingTime() // true|false. Is within the Daylight Saving Time.
Date.today().hasDaylightSavingTime() // true|false. Is Daylight Saving Time observed.

fuentes:
http://code.google.com/p/datejs/
http://www.datejs.com/2007/11/27/getting-started-with-datejs/

Sale pues ahora si me voy espero que te sirva de algo todo esto
-seguro que si
Oras cuidate y hasta la proxima

MANEJO DE FECHAS EN JAVA SCRIPT parte 1

Un saludo a todos los lectores, en este post vamos a hablar un poco del manejo de fechas con

javaScript, como aclaracion no pretendo hacer un analisis extenso sobre este tema si no mas

bien crear una pequeña guia de referencia de la cual podamos partir para ahondar mas en este

tema.

-¿Como maneja java Script las fechas?

Ah pues bien amigo para empezar te dire que el objeto encargado de la manipulacion de fechas

en JS es el objeto date.

JS maneja las fechas en milisegundos, esto se entendera mejor en el ejemplo.

Todos los valores que pasemos como parametros al constructor del objeto date seran entero.

En los meses 0 = ENERO y 11 = DICIEMBRE

En los dias 0 = DOMINGO y 6 = SABADO

Las horas se ponen en formato HH:MM:SS (las horas van de 0 a 23, los minutos y los segundos de

0 a 59)

Si creamos un objeto date sin parametros, este tomara los valores de la fecha actual

ejemplos:

var fecha= new Date(2008,11); en parametros (año, mes)
var fecha= new Date(2008,11,12); en parametros (año, mes,dia)
var fecha= new Date(2008,11,12,10); en parametros (año, mes, dia, horas)
var fecha= new Date(2008,11, 12, 10, 30); en parametros (año, mes, dia, horas, minutos)
var fecha= new Date(2008,11, 12, 10, 30, 50); en parametros (año, mes, dia, horas, minutos, segundos)


-ok, ok ya se como construir un objeto Date pero ahora dime ¿que puedo hacer con ese mentado objeto?

Ah bueno mi querido amigo para poder manipular este objeto como en todos debemos de hacer uso

de sus metodos los cuales se dividen en 2, los primeros sirven para obtener informacion del
objeto date tales como la fecha actual o en que año estamos etc, el segundo tipo de metodos
sirven para establecer los valores del objeto date, es decir podemos hacer que un objeto date
nos guarde el valor de un año poniendo setYear(1999); pues bien sin mas te dejo con los
metodos mas comunes del objeto date:

metodos:
nota: llamar metodos ejemplo: fecha.getDate(); donde fecha es un objeto date

getDate(); devuelve el dia como un entero entre 1 y 31

getDay(); devuelve un num del 0 al 6 indicando siel dia es lunes, martes, miercoles ...

getHours(); Devuelve la hora

getMinutes(); Devuelve los minutos

getMonth(); devuelve el mes como un numero de 0 a 11

getTime(); Devuelve el tiempo transcurrido en milisegundos desde el 1 de enero de 1970 hasta

el momento definido en el objeto date

getYear(); devuelve el año

si a los metodos anteriores les quitamos el get y le ponemos el set podemos modificar dicho

parametro en el objeto date p.e:

setDate(12,0) en parametros (dia, mes)->pone en el objeto date el valor del dia 12 del mes de enero.

setDay();
setHours(); ... etc

toGMTString(); Devuelve una cadena que usa las convenciones de internet con la zona horaria.


- Ah orale pues no esta tan complicado esto del objeto date pero ahora dime ¿ para que puedo ocupar todo esto?

Bueno bueno me agrada que vallas entendiendo todo, pues bien como en todo tipo de

programacion, la funcionalidad que puedas encontrarle ah esto solo esta limitado por tu

creatividad, ahora bien los usos mas comunes que se le dan a los objetos date son para guardar

fechas ya sea la actual o una especifica y hacer operaciones con ellas.

-Haber haber, ahi si ya me perdiste como es eso de hacer operaciones con ellas???

Ok no te preocupes tal vez no fui lo bastante claro pero ahora te explico, puede ser muy

posible que un cliente te pida en una aplicacion el manejo de fechas como por ejemplo el

establecer determinadas fechas limites, es decir que pongas una fecha limite apartir de la

fecha actual y llegada la fecha limite el sistema que desarrollamos nos mande un aviso.

Para que me entiendas mejor has de cuenta que hoy es 12 de agosto del 2008 y que registras un

pedido ya que tu eres dueño de una tienda de viveres, ahora ese pedido en automatico sabemos

que debe de ser entregado antes de 10 dias apartir de la fecha en que se registro el pedido,

pues bien usando el objeto date sumaremos esos 10 dias a nuestra fecha actual para de esta

manera obtener la fecha limite de esta forma si el pedido aun no ah sido atendido y la fecha

limite esta por cumplirse, podemos mandar un mensage informando elvencimiento de dicha fecha.

-ok ok creo que ya te entendi eso de sumar fechas y me supongo que para restar es algo similar, pero segun me acuerdo dijiste que java script maneja todo lo que son fechas en milisegundos, entonces no me queda muy claro ¿como puedo sumar o restar fechas?

ok lo siento tienes razon esto puede parecer muy confuso sin embargo es muy sencillo, me

alegra que mencionaras la propiedad que dice que JS maneja las fechas en milisegundos, eso

quiere decir que pones atencion y vas realmente por buen camino, ademas esta propiedad es la

base para el manejo de fechas con JS. Muchos olvidan esta propiedad y quieren manejar fechas

sumandole al objeto date un numero o haciendo teatro y maromas.

-bien bien si ya dijiste mucho pero la verdad no te acabo de entender

mira lo que quiero decir es que algunos al no estar familiarizados con el objeto date frente a

situaciones como:

sumarle fecha limite ->3 dias apartir de la fecha actual

entonces ellos hacen algo como:

var fecha_actual=new Date();
var fecha_limite=fecha_actual + 3;

Eso por supuesto que es incorrecto,al menos en la estructura elemental de javaScript, algo

como eso se puede lograr a traves de ciertas librerias que ya comentaremos despues, pues bien

te decia y por que es incorrecto?

- no se tu dime, tu eres el que me esta enseñando

jejeje que conchudote me saliste eh pues bien eso es incorrecto por que presisamente se

olvidaron de lapropiedad que me dijiste, quieren sumar el tiempo en dias y ...

- ya se ya se JS maneja el tiempo en milisegundos, pero entonces como le hago para agregar esos 3 dias que quiero digo, segun tu ejemplo?

ahh tipo listillo, ok te dire mira lo primero ya lo sabes todo se maneja en milisegundos, lo

segundo que debes de saber es que los dos metodos que te permitiran manipular de la forma que

queremos las fechas son los metodos getTime() y setTime();, por sino recuerdas para que servia

cada uno aqui te lo vuelvo a repetir:

getTime(); Devuelve el tiempo transcurrido en milisegundos desde el 1 de enero de 1970 hasta

el momento definido en el objeto date

setTime(); Establece una fecha pasandole en milisegundos el valor de esta.


Pues bien para manejar fechas esos son los elementos basicos que siempre debemos recordar.

ok,ok ya te entendi eso pero ya me lo repetiste muchas veces, dejate de rodeos y terminame de explicar como manipulo esas fechas???

Mira pues contigo, ok ya me dejo de rodeos tu ansiedad me agrada por que parece que estas
sediento de conocimientos, pues mira para que acabes de entender esto aqui te pongo un ejemplo
que encontre en:

http://www.webestilo.com/foros/mensaje.phtml?foro=11&msg=39495

, acoplado a nuestro caso que es aumentar 3 dias la fecha actual para obtener asi la fecha limite.

-vaya hasta que por fin vas a poner algo interesante!!!!

Bueno como ya repeti hasta el cansancio JS maneja el tiempo en milisegundos por lo que los 3

dias que deseamos sumar a la fecha actual los debemos de convertir a milisegundos, bueno por

si no andas muy despierto la conversion quedaria asi = 3dias x 24 horas x 60 minutos x 60

segundos x 1000 para pasar todo a milisegundos, ahora veamos como hacemos esto en una funcion:


function actualizar(){
milisegundos=parseInt(3*24*60*60*1000);//pasando los 3 dias a milisegundos

fecha=new Date();//creamos un objeto date con la fecha actual
dia=fecha.getDate();//obtenemosdia actual
mes=fecha.getMonth()+1;//obtenemos mes actual
anio=fecha.getYear();//obtenemos el año actual

document.theForm.campo1.value=dia+"/"+mes+"/"+anio;//mostramos la fecha actual en un campo de texto.

tiempo=fecha.getTime(); //obtenemos el valor en milisegundos de la fecha actual.

total=fecha.setTime(parseInt(tiempo+milisegundos)); //sumamos a el valor obtenido los

milisegundos correspondientes a los 3 dias que deseamos aumentar, en caso de que quisieras

estabeceruna fecha 3 dias antes en vez de 3 dias despues, restamos el valor en vez de sumarlo.

dia=fecha.getDate();
mes=fecha.getMonth()+1;
anio=fecha.getYear();

document.theForm.campo2.value=dia+"/"+mes+"/"+anio; //establecemos fecha limite en un campo de texto
}

Aunque este manejo de fechas sea correcto, es mejor que este calculo lo hagas si es posible en
el servidor en lugar del cliente.

proximo post DateJs donde veremos lo facil que es el manejo de fechas con esta libreria gratuita y que nos simplifica en buen medida el trabajo, ademas es muy facilde implementar, bueno hasta el siguiente post.

Redireccion de paginas

Muchas veces tenemos la necesidad de realizar un redireccionamiento entre una y otra página. Si el servidor contaba con soporte para lenguajes como ASP, CGI o PHP esto era muy fácil, pero para aquellos que no lo tienen, pueden utilizar alguno de los siguientes métodos.



1- Inserta el siguiente script entre las etiquetas <head> y </head>:

<head>

<script languaje="JavaScript">

location.href='direccion.html';

</script>

</head>

2 - Otro método puede ser agregando la acción OnLoad dentro del Body:

<BODY onLoad = "parent.location = 'Direccion.html'">

3 - También se suele utilizar la etiqueta meta Refresh, para redireccionar a X cantidad de segundos:

<META HTTP-EQUIV="Refresh" CONTENT="0;URL=direccion.html">

0 es la cantidad de segundos que va a esperar antes de realizar la redirección

Y direccion.html es la página a redireccionar

Uso de un Archivo externo en JS (compartir codigo) y algo +

Al momento de realizar una aplicacion de tamaño regular al fin de un tiempo podremos observar que como en muchos otros casos existe si no mucho una buena cantidad de codigo que se repite en la mayoria de nuestras paginas, para el buen programador eso aveces suele ser molesto ya que al final de nuestra aplicacion tendremos muchas lineas de codigo repetido que aumentan el tamaño de nuestra aplicacion, una solucion a esta situacion es poner todo ese codigo que se usa constantemente en un archivo con extension .js, cabe aclarar que en ese archivo ira unica y exclusivamente codigo javascript y se invocara en nuestra pagina principal de la siguiente manera:

<script languaje="JavaScript" src="codigo.js"></script>

Mientras buscaba el como hacer esta insercion me encontre con 2 posiciones ambas validas sobre el uso de archivos externos, unos dicen que no tiene caso hacer uso de archivos externos ya que volvemos a lo que en un principio queriamos eliminar, explico esto:
Una ves descargada la pagina al momento de llamar una funcion contenida en nuestro archivo externo, el navegador tendra que ponerse en contacto nuevamente con el servidor para leer este archivo y eso es sacrilegio ya que una de las ideas con las cuales nacio JS era presisamente evitar realizar llamadas constantemente al servidor para de este modo disminuir el trafico que se pudiera generar con este, por tal motivo muchos se ponen en contra del uso de archivos externos, sin embargo en la otra cara de la moneda el uso de archivos externos tiene dos grandes y claras ventajas:

1. El código sólo se carga una vez.Para el resto de páginas en que se use el archivo, el navegador utilizará la copia del fichero que tiene en la caché (no lo descarga de nuevo).
2. Modificando un sólo fichero cambiamos el código de todas las páginas en las que se utiliza (esto es algo realmente importante).

A mi parecer el uso de archivos externos es recomendable, sin embargo cada uno de ustedes tiene la ultima palabra ya que cada uno se enfrenta a situaciones diferentes en las que deberan sopesar si las ventajas de usar codigo encapsulado js son mayores a las de no usarlo.

Otro punto que tambien hay que tener en cuenta que la incluisión de JavaScript en ficheros externos sólo está soportada a partir de las versiones 3.x del IE y del Navigator, aunque esto ya no tiene tanta importancia como años anteriores ya que son pocos los ordenadores que no vengan con IE 6 como minimo, no esta de mas mencionarlo.

A continuacion unos pequeños tips para evitar errores comunes:

FORMATO DE UN ARCHIVO .JS

• Los archivos js se guardan con el formato "nombreDelArchivo.js"
• El fichero js solo debera de contener codigo javaScript, el archivo nos generara error o simplemente no funcionara si le incluimos codigo html, ni siquiera debera llevar las etiquetas de script( <script languaje="JavaScript" > y </script> )

Otra mencion que nos podria ser util, se puede ver en el siguiente bloque de codigo:


<html>

<head>

<title>Usando js</title>



<script language="Javascript" src="scripts.js">

<!--

alert (' Error con el fichero js ');

// -->

</script>



</head>

<body>

Aqui va el resto de la página

</body>

</html>


Como se podra observar entre las etiquetas de llamada del script existe codigo(en este caso es un mensage de alerta), este codigo no se ejecutara a menos que la lectura del archivo .js falle, es decir en este ejemplo si algo falla al momento de caragar el archivo scripts.js saldra una ventana informandonos del error.

OTROS
Existen ocasiones en que apesar de que todo nuestro codigo parece estar bien y aunque lo revisamos ya por enesima al momento de probar nuestra aplicacion esta inexplicablemente no funciona como deseamos y nos saca valores extraños, aqui 3 puntitos que hay tomar en cuenta y que pueden causar el comportamiento extraño de nuestra aplicacion sin que nosotros nos demos cuenta:

1. Evitar que las funciones creadas tengan el mismo nombre que algun campo.
2. A veces al momento de jalar un valor de un formulario puede que el valor que nos mande sea undefined, una causa posible de este error es que tal vez estamos repitiendo el nombre o el id de los elementos por lo que el programa no sabe a cual de los 2 elementos te refires y por eso te manda un valor de undefined.
3. En las expresiones regulares siempre comenzar con el signo de ^y terminar con el de $
   

jQuery

jQuery es un nuevo tipo de biblioteca o framework de Javascript que permite simplificar la manera de interactuar con los documentos HTML, permitiendo manejar eventos, desarrollar animaciones y agregar interacción con la tecnología AJAX a nuestras páginas web. jQuery, al igual que otras librerías, ofrece una serie de funcionalidades basadas en Javascript que de otra manera requerirían de mucho más código. Es decir, con las funciones propias de esta librería se logran grandes resultados en menos tiempo y espacio.

Muy util, ademas es gratuita.
links ayuda:
info: http://es.wikipedia.org/wiki/JQuery
descaragas: http://jquery.com/

Metodos utiles JavaScript

M 1: getElementById()
Uso: var elemento = document.getElementById(id);

Este método pertenece al objeto document. Con él obtendremos el objeto que hace referencia al elemento con un id concreto. Por ejemplo, queremos obtener el objeto del elemento “status”:

<div>

<span id=”status”>Hola mundo...</span>

</div>

<script type=”text/javascript”>

// Obtenemos el elemento “status”

var el = document.getElementById(“status”);

// Mostramos mediante una alerta el contenido del elemento

alert(el.innerHTML);

</script>



Función 2: getElementsByTagName()
Uso:var array_elementos= elemento.getElementsByTagName(tag);

Sirve para obtener un array con todos los elementos con un tag concreto que están contenidos dentro de un elemento. Veamos una ejemplo. Queremos cambiar el color del texto de todos los elementos con tag “A” contenidos dentro del elemento con id “links”:

<a href=”/”>Home</a>

<div id=”links”>

<a href=”http://google.com”>Google</a>

<a href=”http://ubuntu.com”>Ubuntu</a>

<a href=”http://debian.org”>Debian</a>

</div>

<script type=”text/javascript”>

// Obtenemos el elemento con id “links”

var el = document.getElementById(“links”);

// Ahora obtenemos todos los elementos con tag A que hay

// dentro del elemento 'el'

var as = el.getElementsByTagName(“A”);

// Y finalmente recorremos el array de elementos para

// cambiarles el color a cada uno

for (var i=0; i<as.length; i++) {

as[i].style.color = ‘#000'; // negro

}

</script>



Función3: join()
Uso: var string = array.join(string);

El método join() pertenece al objeto Array (todos los arrays en JavaScript son un objeto Array), y nos servirá para unir todos los elementos de un array para forma una cadena de texto. Es el equivalente en PHP a implode(). Ejemplo: Queremos unir todos los nombres de un array mediante comas:
// Creamos el array de nombres
var nombres = ['Luis','Javier','Sancho','Roberto','Rafael','Manuel'];
// Unimos todos los elementos separándolos por comas
var juntos = nombres.join(“, “);
// Y lo mostramos
alert(juntos);

unción4: split()
Uso:var array = string.split(string);

Al igual que join(), split() también es un método del objeto Array, aunque sirve exactamente para lo contrario: dividir una cadena de texto en un array. Siguiendo con el ejemplo anterior:
var juntos = “Luis, Javier, Sancho, Roberto”;
var nombres = juntos.split(“, “);
for (var i=0; i)...

Truco: Usados ambos métodos conjuntamente podremos crear una función para sustituir un texto por otro en una cadena dada:
function str_replace(cadena, cambia_esto, por_esto) {
return cadena.split(cambia_esto).join(por_esto);
}
alert(str_replace('Hola mundo!','mundo','world'));


Función5: addEventListener() / attachEvent()
Uso: Internet Explorer: elemento.attachEvent(“on”+evento, funcion);
Resto de navegadores: elemento.addEventListener(evento, funcion, false);

Ambos métodos hacen exactamente lo mismo, sólo que, como ocurre en otros cientos de ocasiones, Microsoft usa su propia implementación del DOM. Con este método añadiremos eventos a cualquier elemento de la página web, tal como onclick, onmouseover, onmouseout, etc.

Veamos un ejemplo. Crearemos una función para la abstracción de navegadores, es decir, para que funcione tanto en IE como en Firefox o cualquier otro navegador; y después añadiremos el evento onclick a varios elementos DIV para que muestre su contenido mediante una alerta al hacer clic sobre ellos.


<div id=”frases”>

<div>Hola mundo!</div>

<div>Foo bar</div>

<div>Lorem Ipsum</div>

</div>

<script type=”text/javascript”>

// Creamos la funcion para añadir eventos

function nuevo_evento(elemento, evento, funcion) {

if (elemento.addEventListener) {

elemento.addEventListener(evento, function, false);

} else {

elemento.attachEvent(“on”+evento, function);

}

}

// Obtenemos los elementos DIV a los que queremos añadir nuestro evento onclick

var divs = document.getElementById(“frases”).getElementsByTagName(“DIV”);

// Recorremos todos los divs

for (var i=0; i<divs.length; i++) {

// Añadimos el evento onclick al div

nuevo_evento(divs[i], “click”, function(){

// Hacemos que muestre el contenido del DIV

alert(this.innerHTML);

});

}

</script>

Cuando hagamos clic en uno de los DIV, se nos mostrará una ventana de alerta con su contenido.

Función6: focus()
Uso: elemento.focus();

Con este método conseguiremos pasar el foco a un elemento de un formulario. Ejemplo:

<form>

<input type=”text” id=”nombre” value=”Javier” />

<input type=”text” id=”apellidos” value=”Perez” />

</form>

<a href=”#” onclick=”document.getElementById(“nombre”).focus()”>Nombre</a>

<a href=”#” onclick=”document.getElementById(“apellidos”).focus()”>Apellidos</a>



unción7: createElement() / appendChild()
Uso: var elemento = document.createElement(tag);

Con éste método del objeto document crearíamos un nuevo elemento con un tag determinado. Ejemplo: var div = document.createElement('DIV');
Uso: elemento1.appendChild(elemento2);

Con este método añadiremos el elemento “elemento2” a “elemento1”. En el siguiente ejemplo, añadiremos elementos a una lista de forma dinámica:

<input type=”text” id=”texto” />

<input type=”button” value=”Crear” onclick=”crear()” />

<ul id=”lista”></ul>

<script type=”text/javascript”>

function crear() {

// Obtenemos el valor entrado en la caja de texto

var valor = document.getElementById(“texto”).value;

// Creamos un nuevo elemento LI

var li = document.createElement(“LI”);

// Añadimos el valor introducido al nuevo elemento

li.innerHTML = valor;

// Añadimos el elemento LI a la lista UL

var ul = document.getElementById(“UL”);

ul.appendChild(li);

// Vaciamos la caja de texto

document.getElementById(“texto”).value = “”;

}

</script>



Función8: removeChild()
Uso: elemento.removeChild(hijo);

Este método es el usado para eliminar elementos. Se elimina el elemento hijo del objeto. Si queremos eliminar un objeto concreto, tendremos que hacerlo de la siguiente manera:
// Obtenemos el elemento
var el = document.getElementById(“elemento-a-eliminar”);
// Obtenemos el padre de dicho elemento
// con la propiedad “parentNode”
var padre = el.parentNode;
// Eliminamos el hijo (el) del elemento padre
padre.removeChild(el);


Función9: setTimeout() / setInterval()
Uso:var temporizador = setTimeout(funcion, milisegundos);
var intervalo = setInterval(funcion, milisegundos);

Ambos métodos (objeto window) nos sirven para ejecutar código javascript cada x milisegundos, bien para que se ejecute una sóla vez (setTimeout) o bien para que se ejecute ilimitadamente (setInterval). Ambos se pueden cancelar mediante clearTimeout(temporizador) y clearInterval(intervalo). Veamos un ejemplo, donde se muestra la hora y fecha del sistema cada segundo en un DIV:

<div id=”fecha”></div>

<script type=”text/javascript”>

setInterval(function(){

document.getElementById(“fecha”).innerHTML = new Date();

},1000);

</script>




Función10: alert() / confirm() / prompt()
Uso: alert(mensaje);
var resultado = confirm(mensaje);
var resultado = prompt(mensaje, valor);

Con estos métodos (objeto window) mostraremos ventanas modales al usuario. Con alert() simplemente, como hemos visto en otros puntos, mostraremos un mensaje. Con confirm() haremos exactamente lo mismo, pero además obligará al usuario a seleccionar entre dos opciones, una positiva y otra negativa, que se devolverá como parámetro (boolean). Y con prompt() pediremos al usuario que introduzca un texto en una ventana modal. Veamoslo con un ejemplo:
// Pedimos al usuario que introduzca su nombre
var nombre = prompt(“Introduzca su nombre”);
// Pedimos confirmación
if (confirm(“¿Seguro que su nombre es ”+nombre+”?”)) {
// Respuesta afirmativa...
alert(“Hola ”+nombre);
}

confirm() es muy útil para confirmar clics en enlaces comprometidos, que hagan operaciones críticas como eliminación de datos.

<a href=”http://miweb.com/delete/record?id=123” onclick=”return confirm('¿Está seguro?');”>Eliminar registro</a>



Existen muchos más métodos a nuestra disposición, aunque hay que tener en cuenta que Internet Explorer no cumple el estándar ECMAScript/DOM (entre otros tantos estándares web), y puede que un método no funcione igual en IE que en Firefox o Safari.

Aprenderse el DOM es fundamental para poder llegar a ser un buen profesional, pero por suerte para nosotros existen librerías Javascript que nos harán la vida mucho más fácil, como jQuery, la sensación del momento entre los programadores Javascript.