JQuery Tutorial Part 1: Understanding jQuery

As the first tutorial in the jQuery tutorial series on techbriefers, we will get acquainted with jQuery. I will discuss what jQuery is and why you should use jQuery in website creation.

Understanding jQuery

jQuery is a JavaScript library . In the world of programming, a library is a collection of various ‘ready-to-use’ functions to facilitate the creation of an application. Thus, jQuery is a collection of JavaScript functions that makes writing JavaScript code easy .

jQuery was first developed by John Resig in 2006. Since then, jQuery has grown into an open source project and has become the world’s most popular JavaScript library. The official jQuery site is located at jquery.com.

Why should I use jQuery?

To be able to answer this question, you should have already created 1 or 2 JavaScript program code. JavaScript is very powerful for manipulating HTML elements, but its use is also not easy and ‘a little complicated’.

For example, to find an HTML element, with JavaScript we use the getElementById() function :

var x = document.getElementById("mydivid");

With jQuery, the writing is much shorter:

var x = $("#mydivid");

In addition (as with CSS) there are several differences in the implementation of JavaScript from one web browser to another. JavaScript code that runs smoothly on Mozilla Firefox, may not necessarily be able to run in Internet Explorer, and vice versa. This is exacerbated by the different versions of each web browser.

To solve this, jQuery has a built-in function that detects the web browser and provides a replacement function. Thus, we don’t need to bother thinking about the different JavaScript implementations of each web browser.

Advanced JavaScript functions such as AJAX ( Asynchronous JavaScript and XML ) , are also simplified by jQuery. To use AJAX, we only need a few lines of command.

Another feature of jQuery (and perhaps the most important reason), jQuery provides a variety of interesting animation effects. Some of them are very easy to use and only require 1 or 2 lines of code. Especially for creating this animation effect, jQuery also has a jQuery UI that focuses on animation and user interaction.

jQuery also has various plugins or additional code for advanced functions, such as creating slideshow effects, and image carousels, to jQuery mobile. Effects like this are based on the basic jQuery code.

With a variety of features in jQuery, it’s no wonder that jQuery is so popular. It’s not uncommon for novice programmers to know jQuery more than JavaScript.

Even though it has many interesting features, jQuery is still an additional function of JavaScript. 

To be able to use jQuery properly, you should understand how to use JavaScript.

In this tutorial, we’ve covered what jQuery is and why we use it. Next, I will immediately guide you to start using jQuery: How to link jQuery files into HTML.