Sección 2: DOM

Lección 7: jQuery

Aprender a manipular el DOM no es una tarea sencilla. Se necesita de mucha práctica para dominar este tema. Hemos visto que el DOM posee muchas propiedades y métodos que podemos usar para su manipulación, pero constantemente debemos chequear si estos son compatibles con las diferentes versiones de los navegadores web. Para ello usamos sitios como www.cainuse.com

Hace varios años, la forma de manipular el DOM era bastante tediosa. Por ejemplo, muy pocas versiones de algunos navegadores soportaban querySelector. ¿Qué se hizo para solucionar este problema? Se usaba una librería que fue creada para solucionar este problema. Esa librería fue jQuery.

Quizás hayan oído hablar de jQuery. Es una de las librerías más populares de JavaScript. En 2006, jQuery fue introducida al mundo del desarrollo web.

jQuery es solo un archivo de JavaScript creado por varias personas, que añade propiedades y métodos al lenguaje para que podamos hacer uso de ellos. Su principal objetivo fue el de hacer a la manipulación del DOM más sencilla y compatible con todos los navegadores web.

Veamos en w3schools un ejemplo del uso de jQuery: https://www.w3schools.com/jquery

Podemos ver que hay una etiqueta script que carga el archivo JavaScript minimizado de jQuery.

Ahora vemos dentro de otra etiqueta script el código de JavaScript que se ejecuta haciendo uso de la librería de jQuery.

jQuery usa el símbolo $ para iniciar, y vemos que en el ejemplo se indica que cuando el documento esté listo, ejecute todo el código a continuación, el cual selecciona los elementos con etiqueta “p” (párrafos) y oculta luego el elemento sobre el que el usuario hizo un click.

Hay una cosa a destacar de jQuery, y es que hace a nuestro código imperativo. ¿Qué significa eso? Es una palabra que vamos a escuchar un montón cuando trabajemos como desarrolladores. Significa que debemos decirle al programa exactamente lo que debe hacer, paso por paso.

Esto no parece una mala idea, pero cuando nuestros sitios web se vuelven grandes y complicados, esto generará un gran lío. Una acción depende de una acción, la cual a su vez depende de otra acción, la cual depende de otra acción. Será fácil que perdamos de rastro lo que suceda en nuestros programas. Existirán altas probabilidades de que tengamos error y será muy complicado solucionarlos.

Por suerte se han encontrado nuevas mejores formas de hacer las cosas. A su vez, los navegadores web implementaron métodos como querySelector. Incluso existen sitios web como http://youmightnotneedjquery.com donde compara lo que podemos hacer con jQuery y lo que podemos hacer ahora sin él.

Debido a esto, en el 2018 jQuery casi ha dejado de ser una librería necesaria de usar. En el siguiente curso aprenderemos sobre React, la cual es una librería que ha solucionado todo este problema. React en lugar de ser imperativo es declarativo. Aprenderemos más sobre los beneficios de React en el siguiente curso.

Pero es muy importante tener una perspectiva histórica de donde venimos y en qué situación nos encontramos ahora.

Recordemos esto: primero tuvimos HTML, luego CSS y JavaScript, luego vino jQuery para hacer facilitarnos la manipulación del DOM con JavaScript, luego aparecieron algunas librerías como React que hicieron incluso más fácil todo esto.

En el curso siguiente ya no usaremos más la forma de manipular el DOM que aprendimos en este curso. Suena feo, lo sabemos, pero todo lo que aprendimos en necesario para tener una muy buena base para aprender todo lo que veremos en el siguiente curso.

Bueno, eso fue todo por esta sección.

Nos vemos en la siguiente sección, donde aprenderemos varios conceptos avanzados de JavaScript.

¡Adios!