jQuery Syntax

jQuery syntax is through the use of HTML elementsSelectorperformed, and some operations are executed on the elementOperation.

jQuery basic syntax:

$(selector).action()

• $ symbol defines jQuery

• (selector) is used to find HTML elements

• action() is used to perform operations on elements

Example:

$(this).hide()：Used to hide the current element

$("p").hide()：Used to hide all<p>Element

$(".para").hide()：Used to hide all elements with class="para"

$("#para").hide()：Used to hide the element with id="para"

jQuery uses CSS syntax to select elements. In the next chapter, you will learn more about jQuery selectors.

Document Ready Event

You may have noticed that all jQuery methods in our examples are in the document.ready event:

$(document).ready(function(){
　　//　jQuery Method (Executed When DOM is Ready)
　　
　　});

This is to prevent any jQuery code from running before the document is loaded.

The correct approach is to wait until the document is fully loaded and ready before using it.

This also allows you to place JavaScript code at the beginning of the document body.

If a method is run before the document is fully loaded, here are some examples of operations that may fail:

• Try to select an element that has not been created yet

• Try to get the size of an image that has not yet been loaded

jQuery also provides a shorter method for the document.ready event:

$(function()
　　//　jQuery Method, equivalent to the above writing
　　});

Understanding $(document).ready() makes the code easier to read.

Note:This $(document).ready() is an event that is used to safely manipulate the page with jQuery (the code within this event runs only after the DOM is ready).