Thursday, 25 August 2016

Selector in Jquery

By,
Nikhil
 
The use of jQuery is to create much easy to use JavaScript in website.

What Already Know?
Before you jQuery, basics following elements
• HTML
• CSS
• JavaScript

What is jQuery?
jQuery is a lightweight, "write less, do more", JavaScript library.
It takes a lot of common thinks that require many lines of JavaScript code to complete, and get together them into methods that can be called with a single object.
It also simplifies a lot of the complicated code from JavaScript, like AJAX calls and DOM manipulation.
The jQuery library contains the following things:
• HTML/DOM manipulation
• CSS manipulation
• HTML event methods
• Effects and animations
• AJAX
• Utilities

Why jQuery needed?
There are lots of other JavaScript frameworks present in market, but jQuery seems to be the most popular in market, and also the most extendable easy to use also.
Many of the famous companies’ uses jQuery, like:
• Google
• Microsoft
• IBM
• Netflix

Will be jQuery work in all browsers?
The jQuery team knows all issues about cross-browser  CBT, and so they are constructed in that way.
jQuery code or libraries will run exactly same in all  browsers, including Internet Explorer 6!
With jQuery HTML elements are selected and performed "actions" on them.

JQuery Syntax:-
syntax is:-
$(selector).action()

A “$” sign to defines jQuery
A (selector) used to find HTML elements
A jQuery action() tells action to be performed on elements

Examples:

$(this).hide() - hide current element.
$("p").hide() - hide all <p> elements.
$(".abc").hide() - hide all elements with class="abc".
$("#xyz").hide() - hide element with id="xyz".

The Document Ready Event in jQuery:-
You may know that all jQuery methods in example, are inside a document ready event:
$(document).ready(function()
{
    // jQuery methods go here...

});

This is to prevent any jQuery code from running before the document is finished loading (is ready).
It is good practice to wait for the document to be fully loaded and ready before working with it. This also allows you to have your JavaScript code before the body of your document, in the head section.
Here are some examples of actions that can fail if methods are run before the document is fully loaded:

Trying to hide an element that is not created yet.
Trying to get the size of an image that is not loaded yet.

No comments:

Post a Comment