Open In App

jQuery CDN

Last Updated : 01 Dec, 2023
Improve
Improve
Like Article
Like
Save
Share
Report

jQuery CDN is a fast and lightweight JavaScript library facilitating a service that hosts and distributes the jQuery library files to users across the internet. It also helps to simplify the client-side scripting of HTML. The jQuery UI CDN facilitates HTML client-side scripting, rendering the process of creating Web 2.0 applications more straightforward and efficient.

Why use jQuery CDN Links?

  • Performance: jQuery files hosted on a CDN are distributed across multiple servers globally, which enhances speed.
  • Reduce Server load: Using CDN link to the website means your server does not have to handle the load every time for each visitor, which makes it easy to manage whenever heavy traffic comes on the website and makes it more performant
  • Ease of use: It is easy to use developers can include the link in their HTML file.

Official jQuery CDN Link

<script src=
“https://code.jquery.com/jquery-3.7.1.min.js” 
             integrity=
“sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=” 
            crossorigin=”anonymous”>
</script>

Example: This example illustrates the basic implementation of the jQuery CDN Link.

HTML




<!DOCTYPE html>
<html lang="en">
  
<head>
    <meta charset="UTF-8">
    <meta name="viewport" 
          content="width=device-width,
                initial-scale=1.0">
    <title>JQuery CDN Link Example</title>
  
    <!-- JQuery CDN link -->
    <script src=
"https://code.jquery.com/jquery-3.7.1.min.js"
            integrity=
"sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" 
            crossorigin="anonymous">
        </script>
</head>
  
<body>
    <h1 class="gfg"
        style="color: green;">
          GeeksforGeeks
      </h1>
    <p id="bg"
       style="font-size: 20px;">
        Click the button below for apply
        background color using jQuery 
      </p>
    <button id="btn">Click</button>
  
    <script>
        
        // jQuery Code      
        $("#btn").click(clicked)
        function clicked() {
            $("#bg")
                .css("background-color", "rgb(169, 232, 142)");
        }   
    </script>
</body>
  
</html>
 






                        










Output:


jquery
jQuery CDN


Advantages


    

  • Decreased Load Time: If we use CDN links to our projects it will decrease the load time of a particular website this is because it is loaded by the content delivery network, not from your website.
    • 

  • Global Network: Use the CDN links of Google, Cloudflare, Microsoft, etc., according to the user of your website and the global network of the companies provided CDN links.
    • 



Disadvantages


    

  • Availability Dependency: When you are using CDN links it means it will depend on the availability of that CDN.
    • 

  • Regional Restrictions: If the CDN is blocked in a certain region then the user of that area would not properly access the website.
    • 

  • Version Control: It is dependent on the version if you have specified the version in your project then you have to change it over time otherwise you will not be able to benefit from the latest version changes and bug fixes.
    • 





                                    


                                                                        

                                        

                                            

                                                

                                                    
S

        

            
        

        

                                                

                                                

                                                    shivanigupta18rk                                                

                                            

                                            

            
                                        

                                        

                                            
    

        
        
    
                                            

                                                
                                                
                                            

                                            

                                            Improve
                                                
                                            

                                        

                                    



                            

                                                            

                                    
                                        
                                        Previous Article
                                    
                                    
                                    

                                        jQuery Syntax
                                    

                                

                                                            

                                    
                                        Next Article
                                        
                                    
                                    
                                    

                                        JQuery Selectors
                                    

                                

                                                        

                            

            

                

                    

                    
                
 
                
    
                            

                                

                            


                            


            

        
  
                        

                                                

                        
                                                    

                                
Similar Reads

                                

                                    
        
            

                
How to load local jQuery file in case CDN is not available ?

                
jQuery is a lightweight, "write less, do more" JavaScript library. jQuery helps to write JavaScript as simply as easily possible. It is effective in converting a few lines of code in JavaScript to one single line. It also simplifies tasks like Ajax calls and DOM (Document Object Model). The jQuery library contains the following features: HTML/DOM m

            

            
            

                
                3 min read
            

        
    
        
            

                
How to load jQuery locally when CDN fails ?

                
In this article, we will learn how to load our local jQuery file when CDN fails. First of all, why we should use CDN if there is a chance that it fails? There are many advantages of using CDN rather than local jQuery files. Some advantages of using CDN are as follows. It reduces the load from our server.jQuery framework loads faster from these CDN,

            

            
            

                
                3 min read
            

        
    
        
            

                
What is CDN Based Version ?

                
CDN Based Version: A content delivery network is a network of servers that's geographically dispersed to enable brisk web performance by locating clones of web content closer to druggies or easing delivery of dynamic content (e.g., live videotape feeds). Each CDN server is located on what's called the" network edge" near to web than the host garcon

            

            
            

                
                3 min read
            

        
    
        
            

                
How to fallback to the local stylesheet when CDN fails ?

                
This article will teach us to fall back to the local stylesheet if CDN fails. Programmers use the UI libraries by embedding CDN to the HTML template to style the application, but sometimes it fails to load due to some error. In this scenario, we can create the default CSS file and load styles from that file. Problem: Users can go through the below

            

            
            

                
                4 min read
            

        
    
        
            

                
How to import from React-Select CDN with React and Babel ?

                
In ReactJS, import from React-Select CDN is not done in a simple way as we do with the npm packages. To use them we need to use directly them in the HTML file. It does not work with the project set-up by creating a react app. Prerequisites:React JSHTML, CSS, JavaScriptSteps to Import React-Select CDN with React and Babel:Step 1: Create index.html w

            

            
            

                
                2 min read
            

        
    
        
            

                
How to use CDN Links in React JS?

                
React is integrated in the projects using package managers like npm or yarn. However, there are some cases where using Content Delivery Network (CDN) links can be a advantage, especially for quick prototypes, or when integrating React into existing projects. The two libraries imported CDN Links are discussed below Table of Content Importing Bootstr

            

            
            

                
                3 min read
            

        
    
        
            

                
Next.js CDN Support with Asset Prefix

                
Next.js is a react-based framework that has the power to Develop beautiful Web applications for different platforms like Windows, Linux, and Mac. One of the most powerful features of Next.js is its ability to use layouts to create reusable templates for your application. In this article, we will see what is NextJS CDN support with asset prefixes.

            

            
            

                
                4 min read
            

        
    
        
            

                
What is CDN?

                
What is CDN?CDN stands for Content Delivery Network. It is a network that helps to speed up web page loading for web users. It is spread all over the world as usage of the internet is everywhere. It is basically a distributed system of servers that stores the data by the use of Amazon Web services or Google Cloud storage, and it serves that data to

            

            
            

                
                4 min read
            

        
    
        
            

                
CDN Full Form

                
What is CDN?CDN stands for Content Delivery Network. It is a group of geographically distributed servers all over the world that helps in increasing the speed of delivery of web content. Does not matter where you want to access the content it connects you to the closest server so that you can access it easily and fast. It relies on the process call

            

            
            

                
                5 min read
            

        
    
        
            

                
Bootstrap CDN

                
CDN stands for Content Delivery Network. It is used to load the content of a particular framework or library in your HTML document to enhance the web page. Bootstrap CDN is used to add Bootstrap to HTML documents. You can add it using the &lt;Link&gt; tag inside the &lt;head&gt; to load Bootstrap CSS and the &lt;script&gt; tag to load the Bootstrap

            

            
            

                
                2 min read
            

        
                                    

                                                                    
                                                            

                        

                        

                                                            

                                    
Article Tags : 

                                    
                                                                    

                                                                                

                                                

                                

                                    
                                                                    

                            


                        

                            

                                                                                    

                              

                            

                                                        
                        

                    

                

            

        
        


        

                




	
	
	

	
	

	
	    

	
	

	
	



                
        

    

    

        

            

            

        

    















	

    
  

  
  








    
        We use cookies to ensure you have the best browsing experience on our website. By using our site, you
        acknowledge that you have read and understood our
        Cookie Policy &
        Privacy Policy
            
    







   Lightbox