Jquery Download

How To Download Jquery?

To download jquery, we can use jquery cdn or jquery.js file in a webpage. As Jquery is not browser embedded like JavaScript. To use jquery in our web application or webpage, we need to download jquery first and embed jquery file in html. This can be done by downloading offline version of jquery, or use jQuery cdn.

Download jQuery

			 
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
  

Download Jquery using CDN

Jquery can also be downloaded from external sources like Google CDN, Microsoft CDN, CDNJS etc. CDN Stands for Content Delivery Network.

Jquery CDN can load jquery from external resources, thus improve web page performance.

Jquery Google CDN

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

        
			

Start with JQuery

After linking your page with jquery library or cdn, we can use jquery on our webpage. Jquery syntax is started with jquery or $ function. Both jquery and $ means jquery. Jquery can be attached to either head or body tag. For Faster DOM Loading, prefer Jquery in body tag, after content, means just before body closing.

To Avoid Jquery confliction with other javascript libraries that are using $, use jquery.

		
<script src="js/jquery.min.js"></script>	
<script>
	$(document).ready(function(){
		// code goes here
	})
</script>	
					

		
<script src="js/jquery.min.js"></script>	
<script>
	jQuery(document).ready(function(){
		// code goes here
	})
</script>	
					

Jquery Document Ready Function

It is recommended to start Jquery code in $(document).ready(function(){ }), or jQuery(document).ready(function(){ }). Ready Function will execute Jquery functions after web document is fully ready.

$ means jQuery. We can use any one, ($ or jQuery).

(document) means into this web document.

ready means when webpage is ready

(function(){ // code goes here })

		
<script src="js/jquery.min.js"></script>	
<script>
    $(document).ready(function(){
		// jquery code goes here
    })
</script>	
					

		
<script src="js/jquery.min.js"></script>	
<script>
    $(function(){
		// jquery code goes here
    })
</script>	
					

Check Jquery

To check whether Jquery is working or not, open console of your browser and write following code. If Jquery return some function, that means jquery is attached.

    jQuery             // (e,t){return new ct.fn.init(e,t,V)}
            

Also $==jQuery or $===jQuery should return true in console.

   $==jQuery             // true
   $===jQuery             // true
            

Check Jquery Version

Jquery was started in 2006 with Jquery version 1.0. The Latest Jquery version is 3+. To check which version of jquery we are using, type jQuery.fn.jquery in console. This will return Jquery version.

    jQuery.fn.jquery         // return jquery version in string

Jquery noConflict

Sometimes jQuery $ function can conflict with other Javascript libraries. To avoid Jquery conflict , use $.noConflict(). See example

<script src="js/jquery.min.js"></script>	
<script>
    $.noConflict();
    jQuery("document").ready(function(){
    
    })
</script>