Cacher is the code snippet organizer for pro developers

What is jQuery?

jQuery is a lightweight JavaScript Library.

jQuery takes a lot of common tasks that require many lines of JavaScript code to accomplish, and wraps them into methods that you can call with a single line of code. In addition, jQuery has plugins for almost any task out there.

The jQuery library contains the following features:

    HTML/DOM manipulation
    CSS manipulation
    HTML event methods
    Effects and animations
    AJAX
    Utilities


Will jQuery work in all browsers?

jQuery will run exactly the same in all major browsers, including Internet Explorer 6!


Do you wonder why we do not have type="text/javascript" inside the <script> tag?

This is not required in HTML5. JavaScript is the default scripting language in HTML5 and in all modern browsers!

jQuery Syntax: 

The jQuery syntax is tailor made for selecting HTML elements and performing some action on the element(s).

Basic syntax is: $(selector).action()

    A $ sign to define/access jQuery
    A (selector) to "query (or find)" HTML elements
    A jQuery action() to be performed on the element(s)
    
    Examples:
    $("p").hide() - hides all <p> elements.
    

The Document Ready Event:
This is to prevent any jQuery code from running before the document is finished loading (is ready).

$(document).ready(function(){
   // jQuery methods go here...
}); 

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
    
Few Examples of jQuery:

Set a CSS Property: $("p").css("background-color", "yellow"); 
Set Multiple CSS Properties: $("p").css({"background-color": "yellow", "font-size": "200%"}); 
Adds one or more classes: $("h1, h2, p").addClass("blue");
jQuery Syntax For Event Methods: 
$("p").click(function(){
  // action goes here!!
}); 

jQuery - The noConflict() Method:
As you already know; jQuery uses the $ sign as a shortcut for jQuery.

There are many other popular JavaScript frameworks like: Angular, Backbone, Ember, Knockout, and more.
If two different frameworks are using the same shortcut, one of them might stop working.
The noConflict() method releases the hold on the $ shortcut identifier, so that other scripts can use it.
Full reference: http://www.w3schools.com/jquery/jquery_noconflict.asp