Introduction to Jquery

Introduction to JQuery
http://gsbprogramming.blogspot.in/

What is JavaScript (JS)?
• Javascript is a client –side scripting language for the world
wide web, that is similar to the syntax of the Java
programming language.
• JavaScript copies many names and naming conventions from
Java, but the two languages are otherwise unrelated and have
very different semantics.
• Javascript is an object-oriented computer programming
language commonly used to create interactive effects within
web browsers.
• Designed by Brendan Eich
• Developers: Netscape Communications Corporation, Mozilla
Foundation, Ecma International

Why use JavaScript (JS)?
• By executing more web functionality on the user’s machine,
webmasters can optimize their servers to serve more pages.
• The decrease in traffic from constant interaction with the
server can also improve a server’s performance.
• Because the local machine is doing the script processing, the
user can view web pages much faster

How can we embed JavaScript in HTML?
• In head section
<SCRIPT language=“javascript” type=“text/javasccript”>
//Javascript code
</SCRIPT>
• In seperate file then link it to HTML
<SCRIPT src=“filename.js”>
</SCRIPT>

jQuery
• jQuery is a fast, small, and feature-rich JavaScript library. It
makes things like HTML document traversal and
manipulation, event handling, animation, and Ajax much
simpler with an easy-to-use API that works across a multitude
of browsers. With a combination of versatility and
extensibility, jQuery has changed the way that millions of
people write JavaScript.
• jQuery is a javascript library.
• jQuery greatly simplifies javascript programming.
• jQuery is easy to learn.

jQuery
• jQuery is a lightweight, "write less, do more", JavaScript
library.
• The purpose of jQuery is to make it much easier to use
JavaScript on your website.
• 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.
• jQuery also simplifies a lot of the complicated things from
JavaScript, like AJAX calls and DOM manipulation.

Why jQuery?
• There are lots of other JavaScript frameworks out there, but
jQuery seems to be the most popular, and also the most
extendable.
• Many of the biggest companies on the Web use jQuery, such
as:
 Google
 Microsoft
 IBM
 Netflix

How to use jQuery?
• <head>
< script src="jquery-1.11.1.min.js"></script>
< /head>
• <head>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></
script>
< /head>
• <head>
< script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-
1.11.1.min.js"></script>
< /head>

One big advantage of using the hosted
jQuery from Google or Microsoft:
• Many users already have downloaded jQuery from Google or
Microsoft when visiting another site. As a result, it will be
loaded from cache when they visit your site, which leads to
faster loading time. Also, most CDN's will make sure that once
a user requests a file from it, it will be served from the server
closest to them, which also leads to faster loading time.
• A content delivery network (CDN) is a system of distributed
servers (network) that deliver webpages and other Web
content to a user based on the geographic locations of the
user, the origin of the webpage and a content delivery server.

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:
 $(this).hide() - hides the current element.
 $("p").hide() - hides all <p> elements.
 $(".test").hide() - hides all elements with class="test".
 $("#test").hide() - hides the element with id="test".

Using jQuery
< script src="jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
//Put your Code Here
});
</script>

Callback Function
• A callback is a function that is passed as an argument to
another function and is executed after its parent function has
completed. Callbacks are special because they patiently wait
to execute until their parent finishes. Meanwhile, the browser
can be executing other functions or doing all sorts of other
work.

Further References
• http://learn.jquery.com/about-jquery/how-jquery-works/
• http://gsbprogramming.blogspot.in/2015/04/how-to-use-
jquery-in-aspnet.html

Introduction to Jquery

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Destacado

Destacado (14)

Similar a Introduction to Jquery

Similar a Introduction to Jquery (20)

Más de Gurpreet singh

Más de Gurpreet singh (20)

Último

Último (20)

Introduction to Jquery