What is jQuery – The Perks and The Drawbacks

AD

jQuery is basically a JavaScript library and it was designed to make the client-side scripting of HTML more simple. The person responsible for its birth is John Resig at BarCamp NYC in 2006.

It is an open-source software and dual-licensed by MIT License and the GNU General Public License. Version 2. jQuery has received an enormous success and it is used by 31% of the 10,000 most visited websites over internet. This makes jQuery the most popular JavaScript library being used today. We have been sharing jQuery related posts for some time now, so I came up with a post that just defines this new fashion of developing websites.

Introduction

monogram of jquery

The best thing I like in the syntax is that document navigation is quite easy, the code is also very compact (their slogan is Write Less, Do More); yet it  works great for:

  • Creating Animations
  • Handling Events
  • Selecting DOM Elements
  • Developing Ajax Programs

jQuery is excellent for developing dynamic web pages and page elements. It allows the developers to create plugins that would work on top of the JavaScript library. These capabilities enable the designers to make abstractions for low-level interactions and animations, and also to create high-level widgets.

Perks

jquery graph

Simplicity

It can be added to any HTML code in using this simple method.

<head>
<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">
.....
</script>
</head>

You can download jQuery from jQuery Download Page

Implementation

There are two basic ways to use jQuery.

  1. via the $ function, which can be called the default work method for the jQuery object. $ functions, often called commands, are patchable; so each of them returns a jQuery object.
  2. via $.-prefixed functions. These are utility functions which do not work on the jQuery object per se.

Typically, access and manipulation with multiple DOM nodes begins with the $ function being called with a CSS selector string, which results in a jQuery object referencing matching elements in the HTML page.

Plugins

jQuery has got a very well organized architecture. Developers can use it to create their own add-on code to take its functionality to a whole new level. There are millions of jQuery plugins already available on internet for free, including Ajax helpers, data grids, XML tools, drag and drop, cookie handlers…. and the list goes on and on. Probably the best place to download jQuery Plugins is jQuery’s homepage

Special Effects

Another fancy thing about jQuery is that can create special effects with very little code. Here’s an example of an onClick Fade Out function:

<!DOCTYPE html>
<html>
<head>
  <style>
  p { font-size:150%; cursor:pointer; }
  </style>
  <script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
  <p>
  If you click on this paragraph
  you'll see it just fade away.
  </p>
<script>
  $("p").click(function () {
  $("p").fadeOut("slow");
  });
  </script>

</body>
</html>

Now, when you will click this  link, it will slowly disappear. You can check this demo and some more good example tutorials here.

Drawbacks

dont do it

Quite honestly, there are not many drawbacks, in fact, there are none. It’s just that sometimes one tool is not suitable in a situation. It’s just a case of appropriateness. There still are a few things that you should know before you decide to use jQuery on your website.

Use of Selector

jQuery always crosses through all the elements each time you use selectors. This makes the application dull.

Solution: Cache your selections with some variable(s) if you are using the same selection at multiple places. And if you are not selecting an element more than once, just don’t cache selection by assigning it to some variable.

Browser Display

There have been many cases where the code worked fine in one browser, but some properties changed in the other. Actually this is not a jQuery specific problem, this happens with many JavaScript based applications, so it is critical that you don’t just test your page in one or two browsers, but in all of them (at least the four major ones, IE-Firefox-Chrome-Opera).

Conclusion

Simply put, jQuery is great. You can easily perform tasks such as:

  • drop down menus
  • drag and drop elements
  • animations and form validation

All of these with very little coding. Since it synchronizes well with PHP, .Net and most of the other languages, it is a pretty handy resource.

Legal Note: Some of the data was obtained from jQuery.com

create free website wix below post

Further Related Readings

Comments
  1. Richard Kruk January 22, 2011 at 2:35 pm

    A nice overview on jQuery, but a little bit more depth and arguments would have been nice. Nevertheless good job!

  2. Hermitbiker January 22, 2011 at 8:38 pm

    …. a great introduction with simple explanations even a hermit like me can understand… lol !! 🙂

  3. Tayyab January 23, 2011 at 1:15 am

    Thanks for appreciations Richard and Hermit! 🙂

    Richard! Actually Ayaz and some other writers at Designzzz are already writing advance level posts so I thought let’s write something for beginners. I’ll try to be get a little more insight in brief words, next time.

  4. Peter Galiba January 23, 2011 at 12:27 pm

    I don’t know what you mean by: “this happens with many Java based applications”

    JavaScript has nothing to do with Java, except the 4 characters in the name. And no, Java applications has nothing to do with browsers either. Only Java applets has something to do with browsers.

    Just wanted to make it clear.

  5. Jose Fernandez January 24, 2011 at 3:41 am

    It’s a little hard to take your comments seriously when you claim there are no drawbacks to jQuery. I’ve only been using it for a few weeks and I’ve found several:

    1) It eats errors. Sometimes your script will fail and you have no idea why.

    2) Versions are not backwards compatible. Plugins designed for a certain version may not work with future versions.

    3) If you use a jQuery feature and it doesn’t work properly in all browsers it is not trivial to fix.

    I love it, but its far from perfect.

  6. Tayyab January 24, 2011 at 1:07 pm

    @Peter Galiba

    By Java based applications I meant packs such as Ajax etc. but since it was creating a confusion, I have updated it. Nice Point though, thanks.

  7. Tayyab January 24, 2011 at 1:17 pm

    @Jose Fernandez

    hmmm. I think you seriously misunderstood. I meant that no coding language has any faults “It’s just a case of appropriateness”.
    If I was saying that there are NO downfalls for using jQuery, why would this article comprise a “drawbacks” section.
    Anyway, I’ll try to be more clear next time. Thanks for your feedback. 🙂

Comments are closed.

Copyrights © 2016 - Designzzz. All Rights Reserved