Web application development, today, is one of the most sought after fields. HTML, CSS, and JavaScript are the key technologies that help to create interactive and lively web pages. There are several add-on technologies available that can simplify and speed up your work. jQuery is one of those!! This article gives you an introduction to what jQuery is and how you can use it.
Introduction to jQuery
An apt introduction to jQuery, can be that jQuery is a lightweight JavaScript library. Its main purpose is to make you program easily and effectively with JavaScript. It has several built-in methods that you can directly use and that would otherwise require many lines of JavaScript code. So, it simplifies the coding for you, it makes your development faster. Today, many of the popular companies use jQuery including Google, IBM, Microsoft, etc.
Why jQuery?
- It is simple and easy to use, makes JavaScript programming faster.
- It is free and open-source.
- It is SEO friendly and CSS3 compliant.
- It supports cross-browser compatibility which means it can work on any web browser or a mobile device.
- It can help you make animated applications just like Flash.
- It allows for faster page load times.
- It includes DOM & CSS manipulation, event handling methods, effects, animations, AJAX and other utilities.
- Produces similar results to JavaScript with minimal lines of code.
How to get the jQuery Library?
The jQuery library is available as a simple “.js” file. There are two ways to get it:
- You can download it from its official website . There are two versions available: compressed and uncompressed. The compressed version is used for live websites. You can use the uncompressed version while development and testing. It has also got readable code.
- You can also use Content Delivery Networks (CDNs) such as Google and Microsoft. If you use a jQuery file hosted via CDN, it will load faster and efficiently as compared to if you hosted it on your server.
Note: A Content Delivery Network (CDN) is a collective system of servers distributed over a network that delivers content to the users.
How it is Different from JavaScript
jQuery is not a programming language, it is a tool to simplify your JavaScript programming. Just look at the following code to understand the ease it provides:
If you write a “Hello” message in both jQuery and JavaScript, this is how your code will look like :
JavaScript:
document.getElementById("demo").innerHTML = "Hello";jQuery
$("#demo").html("Hello");Can you see the difference?? How logical, short and simple the jQuery code looks!
How to use the jQuery Library?
If you have downloaded the jQuery library, you have to place it in the same directory as your web pages. Next, in your web pages, add the following code in the <head> section to start using jQuery:
<script src="jquery-3.4.1.min.js"></script>In case, you wish to use CDNs, write the following code in the <head> section,
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
(for Google as CDN)And you are ready to go!!
Adding Custom JavaScript
The best part is that you can use jQuery library and your custom JavaScript file both in one web page. For that, you can use two <script> tags as follows:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> followed by,
<script src="js/scripts.js"></script>in the <head> section of your web page.
If you have been coding your web pages using JavaScript, it is high time you explore jQuery as well. Looking at its benefits and ease of coding, you are definitely going to create better and effective website easily. Keep following us to learn jQuery with our upcoming articles.
Hi! I am Geetika, an Assistant Professor by profession and a blogger by passion. I love reading about new technologies and pen down my thoughts on them.
Be First to Comment