EN
jQuery CDN
9
points
In this article, we're going to have a look at how to attach an extended jQuery library from an external server (CDN). The main advantages of this approach are: servers are scattered all over the world, many web pages use the same links so files are cached and link loading is quick because of fast servers.
Below we can see an ordered list of jQuery CDN links:
Google CDN:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
Microsoft CDN:
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.6.0.min.js"></script>
jQuery CDN:
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
cdnjs:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
The next part of the article contains pre-prepared templates.
1. Google CDN with HTML template example
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<script>
$(document).ready(function() {
console.log('Document is ready to use jQuery!');
});
</script>
</body>
</html>
Note: all versions available are here.
2. Microsoft CDN with html tempalte example
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<head>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.6.0.min.js"></script>
</head>
<body>
<script>
$(document).ready(function() {
console.log('Document is ready to use jQuery!');
});
</script>
</body>
</html>
Note: more details you can find here.
3. jQuery CDN with html tempalte example
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<script>
$(document).ready(function() {
console.log('Document is ready to use jQuery!');
});
</script>
</body>
</html>
Note: all versions available are here.
4. cdnjs with HTML template example
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<script>
$(document).ready(function() {
console.log('Document is ready to use jQuery!');
});
</script>
</body>
</html>
Note: all versions available are here.