jQuery 简介
- jQuery 是一个“写得少,做得多”的 JavaScript 函数库
- jQuery 极大简化了 JavaScript 编程
- jQuery 库包含以下功能:
- HTML 元素选取
- HTML 元素操作
- CSS 操作
- HTML 事件函数
- JavaScript 特效和动画
- HTML DOM 遍历和修改
- AJAX
- Utilities
- 大量的插件
jQuery 安装
jQuery 版本
- Production version - 用于实际的网站中,已被精简和压缩(没有缩进)
- Development version - 用于测试和开发(未压缩,是可读的代码)
- 以上两个版本都可以从jQuery官网中下载
jQuery 引用
- jQuery 库是一个 JavaScript 文件,可以使用 script 标签来引用它
<head>
<script src="jquery-1.10.2.min.js"></script>
</head>
jQuery 引用的其他方案
- 如果您不希望下载并存放 jQuery,那么也可以通过 CDN(内容分发网络) 引用它
- 使用 Staticfile CDN 引用
<head>
<script scr="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
</head>
<head>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
</head>
<head>
<script src="https://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.2.min.js">
</script>
</head>
<head>
<script src="https://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js">
</script>
</head>
<head>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script>
</head>
jQuery 函数放在独立文件中使用
- 如果您的网站包含许多页面,并且您希望您的 jQuery 函数易于维护,那么请把您的 jQuery 函数放到独立的 .js 文件中
- 当我们在教程中演示 jQuery 时,会将函数直接添加到 <head> 部分中。不过,把它们放到一个单独的文件中会更好,就像这样(通过 src 属性来引用文件)
<head>
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script src="my_jquery_functions.js"></script>
</head>
jQuery 版本查看
- 使用浏览器的 Console 输入命令 $.fn.jquery 即可查看
![](https://img2020.cnblogs.com/blog/2071327/202009/2071327-20200910134002507-2067072921.png)