Mi rincón en Internet

El uso de selectores CSS en los “frameworks” para JavaScript más conocidos ha permitido lo que hace unos años era impensable: los diseñadores entienden el código de los programadores y los programadores pueden comprender el CSS de los diseñadores.

jQuery es especialmente adecuado: no distingue entre selectores “por id” ni selectores por “clase” (Prototype tiene dos funciones diferentes, $() y $$(), para estas tareas).

$('.lateral a.externo').click(function(ev) {
    // Código  a ejecutar
})

Este sencillo código es fácil de entender y un diseñador al verlo rápidamente intuye que en todos los tags A dentro de la “capa” lateral que tengan la clase externo se hará algo al hacer click.

.lateral a.externo {color: red; padding: 5px; margin: 0;}

Este fragmento de CSS afecta a los mismos elementos que el javascript anterior. Un desarrollador enseguida ve también a qué elementos afecta.

Lo bueno es que si el diseñador y el programador hablan en el mismo lenguaje (selectores CSS), el desarrollo es muy fácil y se puede trabajar en paralelo fácilmente.

La aparición de estas librerías o “frameworks” para programar JavaScript han supuesto un ahorro de tiempo importante para los desarrolladores. Ya no hay que estar tan pendiente de las incompatibilidades entre navegadores, simplifican mucho el trabajo con el árbol DOM, etc.

Empecé a trabajar con Prototype un poco por “imposición técnica” y ya me pareció una maravilla el poder abstraerme de los XmlHttpRequest y demás. Desde hace un tiempo estoy empezando a profundizar más en jQuery, y, en mi opinión, me parece más cómodo y sencillo.

• En jQuery los selectores utilizan la sintaxis de CSS y son uniformes, es más claro — p. ej.: $(’#titulo’) ó $(’div.resaltado’) en Prototype serían $(’titulo’) y $$(’div.resaltado’).
• En jQuery las operaciones típicas como ocultar/mostrar un elemento o conjunto de elementos son más sencillas: da igual que nuestro selector nos devuelva un sólo elemento o un conjunto de ellos, el método es el mismo — p. ej.: $(’#titulo’).hide() ó $(’div.resaltado’).hide()
• Generalizando mucho, podemos decir que jQuery es más conciso y Prototype más explícito.