Search for notes by fellow students, in your own course and all over the country.

Browse our notes for titles which look like what you need, you can preview any of the notes via a sample of the contents. After you're happy these are the notes you're after simply pop them into your shopping cart.

My Basket

You have nothing in your shopping cart yet.

Title: JQuery Basic Notes.
Description: JQuery Basic Notes. I have read various books to prepare these basic notes for the beginners.

Document Preview

Extracts from the notes are below, to see the PDF you'll receive please use the links above


jQuery Introduction

(Source:w3schools
...


What is jQuery?
jQuery is a lightweight, "write less, do more", JavaScript library
...

jQuery takes a lot of common tasks that requires many lines of JavaScript code to
accomplish, and wraps it into methods that you can call with a single line of code
...

The jQuery library contains the following features:







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

Tip: In addition, jQuery has plugins for almost any task out there
...

Many of the biggest companies on the Web use jQuery, like:





Google
Microsoft
IBM
Netflix

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

jQuery Install
Adding jQuery to Your Web Pages
To use jQuery, you need to download the jQuery library (explained below), and include
it on the pages you wish to use it
...
js">

Notice that the

Try it yourself »
Get the latest available version with Google CDN:
If you look at the Google URL above - the version of jQuery is specified in the URL
(1
...
0)
...
8), then Google will
return the latest version available in the 1
...
8
...
8
...
), or you can
take it up to the whole number (1), and Google will return the latest version
available in the 1 series (from 1
...
0 to 1
...
9)
...
As a result, it will be loaded from cache when they visit your
site, which leads to faster loading time
...


W3schools
...


jQuery Syntax
The jQuery syntax is tailor made for selecting HTML elements and perform some action
on the element(s)
...
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:
$(this)
...

$("p")
...

$("
...
hide() - hides all elements with class="test"
...
hide() - hides the element with id="test"
...
You will learn more about the selector
syntax in the next chapter of this tutorial
...
ready(function(){
// jQuery methods go here
...
com

JQuery Notes

pg 4 of40

This is to prevent any jQuery code from running before the document is finished loading
(is ready)
...
This also allows you to have your JavaScript code before the body of your
document, in the head section
...

});
Use the syntax you prefer
...


jQuery Selectors
jQuery selectors are one of the most important parts of the jQuery library
...

With jQuery selectors you can find elements based on their id, classes, types, attributes,
values of attributes and much more
...

All type of selectors in jQuery, start with the dollar sign and parentheses: $()
...
com

JQuery Notes

pg 5 of40

The element Selector
The jQuery element selector selects elements based on their tag names
...
ready(function(){
$("button")
...
hide();
});
});

The #id Selector
The jQuery #id selector uses the id attribute of an HTML tag to find the specific element
...

To find an element with a specific id, write a hash character, followed by the id of the
element:
$("#test")
Example
When a user clicks on a button, the element with id="test" will be hidden:

Example
$(document)
...
click(function(){
$("#test")
...
com

JQuery Notes

pg 6 of40

The
...

To find elements with a specific class, write a period character, followed by the name of
the class:
$("
...
ready(function(){
$("button")
...
test")
...
intro")
$("p:first")
$("ul li:first")
$("ul li:first-child")
$("[href]")

Description
Selects all elements
Selects the current HTML element
Selects all

elements with class="intro"
Selects the first

element
Selects the first

  • element of the first