Prototype Funciones para Elementos HTML

0
36

Prototype Capitulo 04 – Funciones $A(), $H(), $R(), $w()
Siguiendo con las funciones útiles: que trae prototype, en este capitulo concluyo con tales,
les dare una explicacion breve y algunos ejemplos con cada funcion.
1) Utilizando la funcion $A()
La funcion $A() convierte el argumento pasado por parametro en un objeto array
esta funcion combinada con las extensiones que trae prototype hacen mas facil la conversion
de listas enumerables en objetos Array.
una sugerencia para convertir las listas de nodos DOM (DOM nodeList)en array es que puede
ser trabajado mas eficientemente.
Html:

<select id="listaEmp" >
<option value="0001">  Buchanan, Steven    </option>
<option value="0002">  Callahan, Laura     </option>
<option value="0003">  Davolio, Nancy      </option>
</select>
<a onclick="showOptions()"> Show </a>

Javavascript:

showOptions =   function()
{
  var opList  =   $('listaEmp').getElementsByTagName('option');
  var ops     =   $A(opList);
  var emps    =   'Lista de Empleados:n';
  ops.each(
  function(op)
  {
    emps+= op.value+': '+op.innerHTML+'n';
  }
  );
  alert(emps);
}

2) Utilizando la funcion $H()
Esta funcion convierte un array objeto en un hash enumerable
para usarse por ejemplo en una llamada ajax y pasarsela por parametro
Javascript:

testHash    =   function ()
{
  // Primero creamos el objeto
  var params  =   {
  nombre:     'Cesar',
  apellido:   'Mancilla',
  edad    :   '20'
  };
  // Lo transformamos en un Hash
  var hash    =   $H(params);
  alert(hash.toQueryString());
  // -> nombre=Cesar&apellido=Mancilla&edad=20
}
testHash();

3) Utilizando la funcion $R()
Es el alias para crear un objeto objectrange. Este objeto presenta un rango consecutivo de valores que puede ser numerico,
texto, o otro tipo de valores que semanticamente soporte un rango de valores consecutivos. Veamos algunas de sus
funcionalidades:
Javascript:

// Se muestran una iteracion de alertas con el valor actual.
$R(0,10,false).each(function(valor){alert(valor)})
// el recorrido es de 13 veces
$R(0,10,true).each(function(valor){alert(valor)})
// el recorrido es de 12 veces
// Devuelve un booleano si 10 esta incluido en el rango
var bol = $R(0,10).include(10);
alert(bol);
// La funcion $A()
// convierte el objetrange en un array object
// luego inserta la coma ', '
$A($R(0,10)).join(', ');
//-> '0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10'

4) Utilizando la funcion $w()
Con esta funcion podemos crear un array desde una cadena de texto, por cada palabra agregara un campo mas al array.
Javascript:

labels=$w('blogs css javascript tutoriales')
//-> ['blogs', 'css', 'javascript', 'tutoriales']
// muy util por ejemplo para guardar una pagina
// con varias etiquetas separas por un espacio
// ejm:(delicious)
// y despues grabar cada etiqueta para un link
labels.each(function(element){ // guardarLabels(); })