Posteado por: irodriguezm | enero 5, 2010

Función dólar $() en Javascript


La función dólar $() es una de las mas populares en Javascript por que permiten acceder a elementos del HTML de forma sencilla y utilizando poco código. Originalmente fue implementada en Prototype y ahora disponible en la mayoría de librerías como Mootools, jQuery.

Veamos como implementar nuestra propia función $, esto para evitar incluir librerías como Mootools, jQuery o Prototype las cuales tienes los cuales tienes funciones adicionales que en muchas ocaciones no vamos a utilizar, con ello disminuimos el tamaño de nuestros archivos html.

Función $() básica
El objetivo primario de esta función es la seleccionar elementos basados en un identificador, es decir un alias de la función getElementById, entonces podemos crear nuestra primera función dolar.

function $(el) {
return document.getElementById(el);
}
Función $() extendida
La función anterior permite seleccionar un sólo elemento, pero podemos extenderla para pasarle multiples parámetros y que nos devuelva un array con los elementos seleccionados, ello nos permitirá obtener y manipular múltiples elementos de forma rápida.

function $() {
var elements = new Array();
for (var i = 0; i 04. var element = arguments[i];
if (typeof element == “string”) {
element = document.getElementById(element);
}
if (arguments.length == 1) {
return element;
}
elements.push(element);
}
return elements;
}

Esta función recorre uno por uno los parámetros que se les pasa y va agregándolo a un array que posteriormente lo devuelve.

Como utilizar la función $
El uso es sencillo, por ejemplo si tenemos un formulario y deseamos verificar si el campo esta vacio podemos hacerlos de la siguiente forma:

if ($(‘username’).value == ”) {

 alert(‘Error: nombre de usuario vacio.’);

}

Personalmente utilizo la primera versión pues me permite seleccionar los elementos que necesito y ahorrando muchas línes de código comparado con el uso del método getElementById.

Via: blog.unijimpe.net


Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

Categorías

A %d blogueros les gusta esto: