Web.JS.JQuery.Librerías
Jquery es una librería para Java Script que nos va a facilitar mucho la vida a la hora de programar, ya que las cosas se hacen de otra forma pero mucho menos enredoso de lo que hemos estado haciendo hasta ahora con Java Script.
Configuración.
Lo primero y más promordial es cargar la librería de jquery en nuestra página. Se debe colocar entre las etiqueta <head></head>. Se puede descargar o directamente usar los CDN de su página oficial;
Google.
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>Microsoft.
<head>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
</head>Ya cargada la librería empecemos a trabajar.
Selector.
Su sintáxis básica es la siguiente;
$(selector).acción()
$("*").hide() - Oculta todos los elmentos de la página.
$(this).hide() - Oculta el elemento actual.
$("p").hide() - Oculta todas las etiqueta <p>.
$("p.intro").hide() - Ocultar los párrafos cuya clase sea .intro.
$("div > p").hide() - Ocultar hijos directos de <div> que sean <p>.
$(".test").hide() - Oculta todos los elmentos con la clase .test.
$("#test").hide() - Oculta el elemento que tenga la id #test.Estos tipos de selectores son los que se usan en CSS, es decir, que podemos usar los selectores que ya hemos aprendido con CSS.
.hide(); Es una acción que sirve para ocultar elementos de la página.
Como Jquery es una librería para Java Script se debe meter entre las etiquetas:
<script></script> - Etiquetas script para añadir el código en el mismo documento html.
<script scr="js/codigo.js"><script> - Entre las etiquetas script usando el atributo src para indicar el camino donde se encuentra el archivo.js y así hacerlo por separado.Hay que tener en cuenta una cosa antes de empezar a usar jquery. Primero se debe cargar la librería en el <head> y después ya toca colocar los demás script que queramos usar en nuestra página. Siempre hay que ponerlo después de cargar la librería o dará un error al ajecutarlo.
Ready.
Como consejo y buenas prácticas, es aconsejable hacer todos los procedimientos siempre que la página esté cargada por completo, es decir, es posible que una función busque un botón, que por conexión lenta o por algún motivo ajeno a nosotros, no esté cargado en el momento de ejecutarla y eso nos muestre un error, ya que ese selector botón no existe por haber cargado correctamente.
Para arreglar esto existe una método bastante útil en jquery;
$(document).ready(function(){
// instrucciones...
});Este código sirve para saber cuando está cargado completamente el documento y así evitar tales errores metiendo toda instrucción dentro de este método.
