jQuery CDN

17 Mar 2025 | 4 分钟阅读

在本文中，我们将学习与 jQuery 相关的 CDN，在此之前，让我们回顾一下什么是 jQuery。jQuery 是一个 JavaScript 库，主要用于处理事件处理、使用 CSS 和 Ajax 进行动画、HTML DOM 遍历等。它是免费且开源的软件，根据 MIT 许可证运行，并受到近 73% 的千万流行网站的信任。现在让我们进一步了解 CDN。

jQuery 中的 CDN 代表 内容分发网络。CDN 的主要目的是在不实际下载或将其保存在我们网站的文件夹中的情况下包含 jQuery。如今市场上有许多此类 jQuery CDN。例如，Cloudflare、jQuery 的 CDN、Google 和 Microsoft CDN 等。

CDN 无非是一个分发或分发网络，它可以是代理服务器及其数据中心的地理分布网络。CDN 的主要目的是为最终用户提供高度可扩展的性能和可用性相关的服务分发。让我们通过使用当今可用的各种选项来探索一些流行的 jQuery CDN 的方法。在继续使用 jQuery CDN 之前，让我们进行本地安装，以便在我们的系统上正确使用它。

安装

通常，jQuery 在网上提供两个可下载版本。它们是

生产版本：这是为您的直播网站提供的压缩和最小化版本。

开发者版本：主要用于完全操作，例如可读和压缩代码的开发和测试。

注意：建议在编程或调试时使用未压缩版本，而在带宽和性能提升等任务中使用压缩版本。

下一个任务是按照下面显示的步骤进行设置。

<head>
<script src="jquery-3.5.1.min.js"></script>
</head>

将 jQuery 设置到您的 HTML 文件后，继续包含以下代码。

<html>
   <head>
      <title>jQuery Setup</title>
      <script type = "text/javascript" src = "/jquery/jquery-3.5.1.min.js">
      </script>
   </head>
   <body>
      <h1>jQuery Setup</h1>
   </body>
</html>

现在，您可以按照以下步骤使用 jQuery CDN。

您可以直接从 CDN 将 jQuery 库包含到您的 index.html 代码中。如果我们谈论 Google，请参考以下 HTML 代码将 jQuery CDN 导入您的 HTML 代码。

<html>
   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript" 
src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/2.1.3/jquery.
min.js">
      </script>
  
      <script type = "text/javascript">
         $(document).ready(function(){
            document.write("Hello, JavaTpoint");
         });
      </script>
   </head>
 
   <body>
      <h1>Hello</h1>
   </body>
</html>

同样，您可以像下面这样使用 Microsoft 的 jQuery CDN。保留上述代码，只需更改标题标签下的 URL 如下所示。

<html>
   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript" 
src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-
3.2.1.min.js">
      </script>
  
      <script type = "text/javascript">
         $(document).ready(function(){
            document.write("Hello, JavaTpoint");
         });
      </script>
   </head>
 
   <body>
      <h1>Hello</h1>
   </body>
</html>

对于 Cloudflare，请参考以下 URL

<html>
   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript" 
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.
min.js">
      </script>
  
      <script type = "text/javascript">
         $(document).ready(function(){
            document.write("Hello, JavaTpoint");
         });
      </script>
   </head>
 
   <body>
      <h1>Hello</h1>
   </body>
</html>

使用 jQuery CDN 的优点和缺点

优点

使用 jQuery CDN 的优点如下

减少您网站的加载，因为 jQuery 文件将从 CDN 加载，而不是从您的网站加载。CDN 将通过从 CDN 加载数据而不是直接从网站加载数据来减少您网站的负载。它将提高网站的整体性能。
CDN 的另一个优点是它提供的速度和敏捷性，因为它不直接从站点加载，从而使用户能够利用最近的地理位置概念。CDN 由大量高度负载均衡算法和数据服务器支持，确保 jQuery 以闪电般的速度提供。

缺点

使用 jQuery CDN 的缺点如下

由于用户连接上启用了过滤器和代理服务，托管 jQuery 时可能会出现阻塞情况。
由于大多数浏览器启用的超时属性（确切地说是 30 秒），jQuery 可能会失去平衡。

总结

在本教程中，我们从头开始学习了如何设置 jQuery 以便与 CDN 一起使用，而不是从您的常规网站使用。我们还了解了内容分发网络的整体架构以及它如何提高加载性能。我们可能熟悉 HTML 和 CSS，并且与 jQuery 一起，CDN 将帮助它们增强负载均衡因素，从而高效地提供速度，而不是依赖于网站。我们还遇到了各种安装技术，无论是 Google、Microsoft 还是 Cloudflare，以及如何将它们包含在我们的 HTML 文件的 <head> 标签中。最后，我们讨论了使用 jQuery 的优缺点，并讨论了应在何种基础上使用以及何时应实现。

因此，jQuery CDN 是一个独特的工具包，可提供宝贵的负载均衡支持，同时管理到最终用户的相关分发服务。

下一主题JQuery 分页

jQuery CDN

安装

注意：建议在编程或调试时使用未压缩版本，而在带宽和性能提升等任务中使用压缩版本。

使用 jQuery CDN 的优点和缺点

优点

缺点

总结

联系信息

关注我们

教程

面试题

在线编译器

Python

Java

.Net Framework

AI, ML and Data Science

Cloud Technology

B.Tech and MCA

Web Technology

PHP

Software Testing

Technical Interview

Java Interview

Python

Web Interview

Database Interview

B.Tech / MCA

Important Interview

Software Testing Interview

Company Interviews

Online Compilers

Multiple Choice Questions

jQuery 教程

jQuery 效果

jQuery HTML/CSS

jQuery 表单

jQuery 事件

jQuery 杂项

jQuery 问题

杂项

jQuery 多选题

jQuery UI

面试题

jQuery CDN

安装

注意：建议在编程或调试时使用未压缩版本，而在带宽和性能提升等任务中使用压缩版本。

使用 jQuery CDN 的优点和缺点

优点

缺点

总结

相关帖子

如何在 jQuery 中获取文本框值

仅允许在文本框中使用 10 个数字，使用 Jquery

如何使用 jQuery 将 HTML 表格转换为 Excel 电子表格

使用带有 Bootstrap 的 jQuery 动态添加删除输入字段

使用 jQuery 的 Gauge 图表插件

Jquery Flickerplate 插件

条形码 jQuery 示例

使用 jQuery 延迟加载图像

JQuery 输入掩码电话号码验证

在 jQuery 的下拉菜单中获取选定的值

订阅 Tpoint Tech

联系信息

关注我们

教程

面试题

在线编译器