jQuery参考实例 1.1 在页面中导入jQuery

最新推荐文章于 2023-02-01 19:01:31 发布

邵钏

最新推荐文章于 2023-02-01 19:01:31 发布

阅读量1.9k

点赞数

原文：

http://www.lifelaf.com/blog/?p=168

本文翻译自jQuery Cookbook (O’Reilly 2009) 1.1 Including the jQuery Library Code in an HTML Page

需求

在网页中使用jQuery

解决方案

在网页中嵌入jQuery库，目前有两种成熟的方案：

使用Google提供的内容分发网络（CDN）来导入某个版本的jQuery。
从jQuery.com官方网站上下载某个版本的jQuery，并部署到自己的服务器上。

讨论

导入jQuery与导入别的任何一个外部JavaScript文件并没有什么不同，只需使用HTML的<script>标签，并对该标签的src属性赋值即可。以下是一个导入jQuery的例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <script type="text/JavaScript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</head>
<body>
<script type="text/JavaScript">
alert('jQuery ' + jQuery.fn.jquery);
</script>
</body>
</html>

上述示例中使用了Google内容分发网络所提供的jQuery压缩版本。不过，在压缩后的JavaScript代码中调试错误是一件很困难的事情。因此，为了调试潜在的JavaScript错误，在开发阶段使用非压缩的版本会更好。更多有关Google提供的jQuery信息可以参见：http://code.google.com/apis/ajaxlibs/。

当然，我们也可以使用更加传统的方式：在自己的服务器上部署jQuery。但大多数情况下，这样的做法并不明智。使用Google提供的jQuery有很多好处：jQuery的版本更加稳定可靠、用户的下载速度更快、网络延迟更小、jQuery文件已经被缓存在浏览器中的概率更高等等。

有些情况下，开发人员并不想使用Google提供的jQuery — 可能是开发者需要一个定制化的jQuery；也可能因为最终产品仅在局域网中使用，无法访问internet；或者纯粹出于个人好恶。如果不使用Google提供的jQuery，开发人员可以从jQuery.com上下载jQuery文件并复制到自己的服务器上。在使用时，与上述示例类似，只需把src属性的值修改为相应的jQuery文件地址就可以了。