Para incluír Prototype en las páginas web se debe agregar la siguiente línea a la sección de head, reemplazando la ruta src con la adecuada.
<script src="lib/prototype.js" type="text/javascript"></script>
La función $() reemplaza a la expresión document.getElementById del JavaScript estándar revisando el árbol de elementos DOM y retornando una versión ampliada del elemento en cuestión. Esta función recibe como parámetro la etiqueta del ID del elemento o directamente la referencia al objeto DOM para obtener su versión ampliada. Más información.
a = document.getElementById('seccion_1'); // JavaScript convencional.
b = $('seccion_1'); // Estilo Prototype.
a.style.display = 'none'; // JavaScript convencional.
b.hide(); // Gracias a la extensión de los elementos que provee Prototype.
Esta función puede utilizarse con varios parámetros en un único llamado.
secciones = $('seccion_1', 'seccion_2', 'seccion_3');
Esto equivale a decir lo siguiente.
secciones = [];
secciones[0] = $('seccion_1');secciones[1] = $('seccion_2');
secciones[2] = $('seccion_3');
La función $w() convierte cadenas con palabras separadas por espacios en arreglos cuyas celdas corresponden a estas palabras. Más información.
numeros = $w('uno dos tres cuatro');
El contenido de numeros será entonces ['uno', 'dos', 'tres', 'cuatro'].
La función $$() realiza búsquedas basadas en los selectores de CSS, el resultado de esta función será siempre un arreglo toda vez que la búsqueda podrá arrojar múltiples resultados. Más información.
$$('div') // Todos los divs.
$$('#seccion_1') // Igual que $('seccion_1') pero en forma de arreglo.
$$('li.resaltado') // Todos los LI que tengan la clase 'resaltado'.
$$('#seccion_1 p') // Todos los P dentro de seccion_1.
Existen múltiples opciones para esta función flexible, para consultar mas información al respecto revise el API correspondiente.
La función $A() convierte (promueve a) los elementos estilo colección (o arreglo) en objetos Array de Prototype. La ventaja de utilizar este método es que enriqucerá el resultado con los método de la clase Array como each, indexOf y toJSON, facilitando el procesamiento de la información contenida en él. Más información.
Esta función opera bajo las siguientes premisas:
- Si el valor es null, undefined o false, el arreglo resultante es vació.
- Si el objeto presenta el método toArray() entonces este método es utilizado.
- De lo contrario los valores del objeto son recorridos y manipulados de la manera convencional.
La función $F() toma un elemento campo de un formulario, ya sea el objeto DOM o su respectivo ID y retorna el valor contenido en el campo. Es una versión mejorada de la sentencia document.getElementByID('elemento').value. Más información.
Esta función opera bajo las siguientes premisas:
- Para las listas de selección múltiple se obtiene un arreglo con cada uno de los valores selccionados.
- Para los checkboxes y radiobuttons no seleccionados se obtiene null.
- Para cualquier otro elemento se obtiene una cadena de texto con el valor del campo.
La función $H() convierte (promueve a) un hash de JavaScript un objeto Hash de Prototype con sus consiguientes métodos ampliados. Más información.
opciones = $H({color: 'rojo', sabor: 'salado', tipo: 'alimento'});
opciones.keys(); // Retorna ['color', 'sabor', 'tipo'].
opciones.values(); // Retorna ['rojo', 'salado', 'alimento'].
La función $R() crea objetos rango (ObjectRange) de Prototype con sus respectivos métodos y usos útiles. Más información.
$R(1, 10).each(function(i)
{
// Se ejecuta 10 veces iterando a i desde 1 hasta 10.
});
$A($R(1, 10)); // Retorna el arreglo [1, 2, 3, 4, 5, 6, 7, 8, 9, 10].
Tags: JavaScript, Prototype
Loading ...
