JQuery Syntax | Explicado

En sintaxis de jQuery, Todas las declaraciones se basan en una plantilla básica que aplica diferentes métodos y funciones a los elementos HTML y sus atributos relacionados. También puede personalizar la sintaxis jQuery de acuerdo con el selector y la acción adicionales, que puede ser un método o función.

Este artículo explicará la sintaxis de jQuery en detalle con la ayuda de ejemplos adecuados. Entonces, comencemos!

JQuery Syntax | Explicado

En jQuery, lo primero que debe hacer es seleccionar los elementos HTML en los que desea realizar cualquier acción. La sintaxis básica de jQuery es la siguiente:

$ (selector).acción();

En la sintaxis jQuery dada anteriormente, debes agregar un "ps"Firmar para acceder o definir jQuery; Entonces un "selector"Se agrega entre paréntesis, que representa la consulta para encontrar los elementos HTML. Por último, "acción()"Es la operación que se realizará en los elementos HTML seleccionados.

Ahora vamos a ver los tipos de selectores que puede agregar en la sintaxis jQuery.

Tipos de selectores en la sintaxis jQuery

Los selectores jQuery se consideran una parte esencial de la biblioteca jQuery. Para utilizar cualquier método jQuery, debe crear un objeto jQuery seleccionando un elemento HTML específico.

Existen varios tipos de selectores en jQuery, como Selector de nombre del elemento, Elemento #ID selector, y Elemento .selector de clases. Por ejemplo, para seleccionar todo el párrafo "pag"Elementos, usaremos el selector de nombre del elemento de la siguiente manera:

$ ("P").esconder()

También puede asignar una ID a un elemento HTML y luego realizar la misma operación utilizando el elemento Selector #ID:

$ ("#btnclick").esconder()

Con la ayuda del elemento .Selector de clases, puede seleccionar diferentes elementos HTML simultáneamente que pertenecen a la misma clase:

ps.nombre de la clase").esconder()

Nota: Para seleccionar elementos HTML usando ID, agregue el carácter hash "#,"Seguido de la identificación del elemento y para encontrar elementos utilizando su nombre de clase, agregue un"."Personaje de período seguido del nombre de la clase.

Evento de documento listo en la sintaxis jQuery

Antes de trabajar con un "documento"En jQuery asegúrese de que esté completamente cargado y esté listo para usar. El "listo()"Evento del"documentoEl elemento se puede utilizar para este propósito:

$ (documento).Ready (function ()
// Escribir métodos jQuery en el cuerpo
);

El método anterior evitará la ejecución de jQuery cuando el "documentoEl elemento no está listo. Sin embargo, si está tratando de ocultar un elemento HTML que aún no se ha creado, entonces la acción especificada fallará en este caso. Entonces, asegúrese de que el "documento"Está listo antes de ejecutar el código jQuery.

Aquí hay un método más corto para escribir el evento listo para el documento:

$ (function ()
// Escribir métodos jQuery en el cuerpo
);

Ejemplo: Uso de la sintaxis jQuery para ocultar un elemento HTML
Este ejemplo demostrará el uso de la sintaxis jQuery para ocultar un elemento HTML con la ayuda del selector de nombres de elementos. En primer lugar, en nuestro "índice.html"Archivo agregaremos un encabezado con el"H2"Tag, un párrafo usando el"

"Etiqueta, y un"Haz click en mi!" botón:

Encuentra elementos HTML en jQuery

Este es el párrafo principal con algún texto de muestra

Haz click en mi!

Puede utilizar cualquier sandbox de codificación en línea o su editor de código favorito para ejecutar el programa; Sin embargo, usaremos el código de Visual Studio:

A continuación, avance hacia su archivo JavaScript, que es "mi proyecto.js"En nuestro caso y escriba el siguiente código en él:

$ (documento).Ready (function ()
$ ("botón").hacer clic (function ()
$ ("H2").esconder();
);
);

El código proporcionado especificó que jQuery "$ (documento).listo()"El método ocultará el elemento HTML con el"H2"Nombre del elemento cuando el usuario hace clic en el botón:

Después de guardar ambos archivos, abriremos "índice.html"Usando el código VS"Servidor hepático" extensión:

Ahora, haremos clic en el botón resaltado en la imagen dada a continuación:

Como puede ver, hemos ocultado con éxito el "H2"Elemento HTML siguiendo la sintaxis jQuery:

Eso se trataba de la sintaxis básica de jQuery. Puede explorarlo más de acuerdo con sus preferencias.

Conclusión

El $ (selector).Action () es la sintaxis básica de jQuery que se puede usar para seleccionar elementos HTML y aplicarles acciones específicas a ellos. Una vez que haya escrito el código requerido siguiendo la sintaxis jQuery, puede utilizar el $ (documento).Ready (function () ) método para ejecutar el programa. Este artículo discutió la sintaxis jQuery, los tipos de selectores jQuery y la funcionalidad de $ (documento).Ready (function () ) método en detalle.