miércoles, 27 de marzo de 2013

La 10 funciones más usadas de javascript







Dedicamos un poco de tiempo para darles a conocer las 10 funciones más genéricas de javascript  y que forman parte de la mayoría de las aplicaciones del lado del cliente. Actualmente sabemos el poder que a llegado a tener este lenguaje popular al lado del cliente, a continuación conozcamos más sobre el poder y sus funciones de este lenguaje.



Función 1. 

getElementById()

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 en concreto.


Función 2. 

getElementsByTagName()

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. Por ejemplo: deseamos 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ón 3.

 join()

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().


Función 4. 

split()

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.

Truco: Usados ambos métodos conjuntamente podremos crear una función para sustituir un texto por otro en una cadena dada:

Función 5. focus()

elemento.focus();

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


Función 6. 

setTimeout() / setInterval()

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).


Función 7. 

addLoadEvent()

Se trata de una versión exclusivamente para el objeto window en el eventoonload, de forma que podremos asignar una serie de funcionalidades a nuestro evento onload y ver el resultado al finalizar la carga de nuestra web. Tambien es posible usar addEvent() para realizar lo mismo. Creada por Simon Willison.


Funicón 8. 

getElementsByClass()

Una gran función que mediante un nombre de clase (CSS), podremos encontrar los elementos que la compongan, devolviendo un arreglo de objetos para trabajar con ellos de forma más cómoda. Originalmente no fue creada por nadie en particular aunque con el tiempo los desarrolladores han ido añadiendo mejoras para depurar la función. Más acerca de esta función.


Función 9.  

getCookie(), setCookie(), deleteCookie()

La implementación de estas funcionalidades en PHP es más fácil.


Función 10.  

alert() / confirm() / prompt()

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.

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

0 comentarios:

Publicar un comentario



 
contador de visitas