Thursday, June 27, 2013

Structure of JQuery

JQuery Synax

JQuery, the name itself says it is querying something. It means it selects a particular HTML element and performs some action on it. Hence the syntax of a JQuery is also in that format only.

$(selector).action(), where
  • $ is for representing it as a jQuery.
  • selector represents the HTML element to be selected.
  • action() represents the kind of action we perform on the selected element.


For example,

$(this).hide() - hides the current element.
$("p").hide() - hides the text under <p> tag.

Note: These selectors are may be CSS selectors also.

Document Ready Event

Generally for every JQuery method, we write the method inside of document ready event. This is because to make sure that the jQuery is executed once the document loads completely. We can also write the methods directly. But it is better to write them under document ready event. This is a good practice to avoid errors.

$(document).ready(function() {
                   // JQuery methods
});
                               or
$(function() {
                  // JQuery methods
});
We can use either of the methods to ensure that the jQuery is executed once the document loads.