Free Online Courses for Software Developers - MrBool
× Please, log in to give us a feedback. Click here to login
×

You must be logged to download. Click here to login

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

Introduction to jQuery

In this article we will take a brief introduction to jQuery, this great and powerfull javascript library.

In this article we will talk a little bit about jQuery, this great and powerfull library in Javascript.

Did you tried JavaScript?

Did you found it Easy and friendly?

Do you believe that it can get easier and gave you more it can do ?

Do you believe that you can write less and do more?

The answer is YES, and JavaScript is good because:

  • Very high level, it can even be Object Oriented.
  • Portable and ideal, no problem to use it anywhere or any device.
  • Dynamic, which gave spirit to the static HTML tags,”also HTML5 supports it strongly”.
  • Weakly typed , no restricted syntax, no restricted roles.
  • It’s today's trend.

Although, it gave some shortage in the following points:

  • Limiting in resources.
  • Limited IDE Support since too little IDEs that provide syntax checking and auto-complete.
  • No Debuggers, Errors due to JS are hard to eb detected and debugging although developer tools in browsers now facilitate the problem but not solved.
  • Browser Compatibility which is the biggest issue JS developer can meet, since some functionality is supported by browser but no other.
jQuery Logo

Figure 1: jQuery Logo

As standard, Javascript refused to unsolve such problems. So, JavaScript Libraries came to life to overcome the previous shortage in Traditional Javascript providing more attractive functionalities and solutions to Developers.

They could in few years hide the major browser differences so Problem of compatibility had now gone in addition to simplifying common operations “using the concept of write less” and providing clean APIs for dealing with DOM , animation , Ajax , JSON , etc.

Which are open source and editable, so anyone can upgrade it and add his own addition to satisfy his increasing needs.

Really, worth trying.

The commonly used Javascript libraries are: Prototype,Script.aculo.us and of course JQuery which is written by John Resig in 2006 and by its power became number one in JS Libraries.

It took the trend of DOM traversing, event handling, working with Ajax sufficiently and Effects & animations.

Because it's very powerful, integration happened between it and some frameworks to become essential part of it, like ASP.net MVC and Struts 2.

But why they preferred to use it instead of other libraries? i.e. why it became standard?

For the following reasons:

  • They are friendly APIs, easy reading, understanding and editing.
  • DOM traversing is very easy specially for complex criterion,now it's easy to select, traverse and modify elements contents by calling it's selector.
  • Library is available to download with demos how to use, and very small size i.e. its light weight, which will not make overhead on the project especially with maven.
  • Effects and animations “like calender, accordion, dialogs, fade in and out, etc. Are now available with new trends in the code library so no need to get additional .js files.
  • Plug-ins are available to cover all need
  • rich UI and Controls
  • Event handling with widely used events defined in jquery even without exposing ourselves to HTML code events.
  • Ajax support that gave interactivity with server to the HTML code, using Ajax , data can be sent to servlet, action, etc and get response to be displayed on the page, the most seen examples in ajax is loading cities according to selected country.
  • It supports CSS3 selectors and xpath syntax. The most famous projects written using jQuery was OS simulator, and online office.

Evolution of JQuery and changes: “according to wikipedia and jquery website”:

Version number Release date Additional notes
1.0 August 26, 2006 First stable release
1.0.1 August 31, 2006
1.0.2 October 9, 2006
1.0.3 October 27, 2006
1.0.4 December 12, 2006 Last 1.0 bug fix
1.1 January 14, 2007
1.1.1 January 22, 2007
1.1.2 February 27, 2007
1.1.3 July 1, 2007
1.1.3.1 July 5, 2007
1.1.4 August 24, 2007
1.2 September 10, 2007
1.2.1 September 16, 2007
1.2.2 January 15, 2008
1.2.3 February 8, 2008
1.2.4 May 19, 2008
1.2.5 May 21, 2008 Fix for bad build of 1.2.4
1.2.6 May 24, 2008
1.3 January 14, 2009 Sizzle Selector Engine introduced into core
1.3.1 January 21, 2009
1.3.2 February 20, 2009
1.4 January 14, 2010
1.4.1 January 25, 2010
1.4.2 February 19, 2010
1.4.3 October 16, 2010
1.4.4 November 11, 2010
1.5 January 31, 2011 Deferred callback management, ajax module rewrite
1.5.1 February 24, 2011
1.5.2 March 31, 2011
1.6 May 3, 2011 Significant performance improvements to the attr() and val() functions
1.6.1 May 12, 2011
1.6.2 June 30, 2011
1.6.3 September 1, 2011
1.6.4 September 12, 2011
1.7 November 3, 2011 New Event APIs: .on() and .off(), while the old APIs are still supported.
1.7.1 November 21, 2011
1.7.2 March 21, 2012
1.8.0 August 9, 2012 Sizzle Selector Engine rewritten, improved animations and $(HTML, props) flexibility.
1.8.1 August 30, 2012
1.8.2 September 20, 2012
1.8.3 November 13, 2012
1.9.0 January 15, 2013 Removal of deprecated interfaces and code cleanup
1.9.1 February 04, 2013
2.0.0 early 2013 Dropping IE6-8 support for performance improvements and reduction in file-size

Another question, does it mean that using jQuery prevent from using other library with?

The answer is NO, you can include any libraries together without conflicting. It's the power of libraries.

So, is using jQuery veiling the essential Javascript functionality that we used to use before?

The answer here is also NO, jQuery keeps Javascript library, it just extend functionality, not cancel main ones, and you can use the old functionality with the new one.

It means that you can use strings, numbers, objects, functions, callign context as usual without any change and with the old syntax.

Well, now we know why we should use JQuery, but the question is how to use it?

You can download the source jquery-..-min.js from the official website and include it to your project or use the online support by including the following to page head:

Listing 1: Using jquery

  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
  <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>

Calling jquery function:

At first JQuery code must be included in a tag as it's JavaScript at the end and you need to include your calling code between the following lines to register your event to the document.

Listing 2 : Using jquery

                 <script type="text/javascript">
                        $(document).ready(function(){
                                                       //your code is written here
                                                       });
                </script>

Or it can be abbreviated to be

                <script type="text/javascript">
                        $(function(){
                                   //your code is written here
                         });
                </script>

The reason for writing code inside the previous selector is to stop any jquery code of being executed before the document is fully loaded.

This is all for a basic introduction. See you next time.



My main area of specialization is Java and J2EE. I have worked on many international projects like Recorders,Websites,Crawlers etc.Also i am an Oracle Certified java professional as well as DB2 certified

What did you think of this post?
Services
[Close]
To have full access to this post (or download the associated files) you must have MrBool Credits.

  See the prices for this post in Mr.Bool Credits System below:

Individually – in this case the price for this post is US$ 0,00 (Buy it now)
in this case you will buy only this video by paying the full price with no discount.

Package of 10 credits - in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download few videos. In this plan you will receive a discount of 50% in each video. Subscribe for this package!

Package of 50 credits – in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download several videos. In this plan you will receive a discount of 83% in each video. Subscribe for this package!


> More info about MrBool Credits
[Close]
You must be logged to download.

Click here to login