JavaScript 框架(库)
JavaScript 高级程序设计(特别是对浏览器差异的复杂处理),通常很困难也很耗时。
为了应对这些调整,许多的 JavaScript (helper) 库应运而生。
这些 JavaScript 库常被称为 JavaScript 框架。
在本教程中,我们将了解到一些广受欢迎的 JavaScript 框架:
- jQuery
- Prototype
- MooTools
CDN -内容分发网络
您总是希望网页可以尽可能地快。您希望页面的容量尽可能地小,同时您希望浏览器尽可能多地进行缓存。
如果许多不同的网站使用相同的 JavaScript 框架,那么把框架库存放在一个通用的位置供每个网页分享就变得很有意义了。
CDN (Content Delivery Network) 解决了这个问题。CDN 是包含可分享代码库的服务器网络。
Google 为一系列 JavaScript 库提供了免费的 CDN,包括:
- jQuery
- Prototype
- MooTools
- Dojo
- Yahoo! YUI
但是由于 Google 在中国经常被GFW(防火长城,英文名称Great Firewall of China,简写为Great Firewall,缩写GFW)屏蔽,造成访问不稳定,所以建议使用百度静态资源公共库。
如需在您的网页中使用 JavaScript 框架库,只需在 <script> 标签中引用该库即可:
引用 jQuery
百度 CDN:
<head> <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> </script> </head>
网页中添加 jQuery
可以通过多种方法在网页中添加 jQuery。 您可以使用以下方法:
- 从 jquery.com 下载 jQuery 库
- 从 CDN 中载入 jQuery, 如从 Google 中加载 jQuery
下载 jQuery
有两个版本的 jQuery 可供下载:
- Production version - 用于实际的网站中,已被精简和压缩。
- Development version - 用于测试和开发(未压缩,是可读的代码)
以上两个版本都可以从 jquery.com 中下载。
jQuery 库是一个 JavaScript 文件,您可以使用 HTML 的 <script> 标签引用它:
<head> <script src="jquery-1.10.2.min.js"></script> </head>
提示: 将下载的文件放在网页的同一目录下,就可以使用jQuery。
![]() | 您是否很疑惑为什么我们没有在 <script> 标签中使用 type="text/javascript" ? 在 HTML5 中,不必那样做了。JavaScript 是 HTML5 以及所有现代浏览器中的默认脚本语言! |
---|
使用框架
在您决定为网页使用 JavaScript 框架之前,首先对框架进行测试是明智的。
JavaScript 框架很容易进行测试。您无需在计算机上安装它们,同时也没有安装程序。
通常您只需从网页中引用一个库文件。
为了引用某个库,请使用 <script> 标签,其 src 属性设置为库的 URL:
<!DOCTYPE html>
<html>
<head>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js">
</script>
</head>
<body>
</body>
</html>