jQuery 介绍

jQuery 是一个 JavaScript 库，极大地简化了 JavaScript 编程，是目前最流行的 JS 框架，而且提供了大量的扩展，其核心思想是 "write less, do more"。

---

jQuery 安装

在网页中引入 jQuery 可以通过两种方法：

1. 从网站 jquery.com 下载 jQuery 库
2. 从 CDN 中载入 jQuery，如从 Google 中加载 jQuery

下载 jQuery 库

有两种版本的 jQuery 可供下载：

• Production version - 用于实际的网站中，已被精简和压缩。

• Development version - 用于测试和开发（未压缩，是可读的代码）

下载的 jQuery 库是一个 JavaScript 文件，可以通过 HTML 的 <script> 标签引用 [图片上传失败...(image-8aa604-1547973653436)]

从 CDN 中载入 jQuery

Staticfile CDN、百度、又拍云、新浪、谷歌和微软的服务器都存有 jQuery ，如果你的站点用户是国内的，建议使用百度、又拍云、新浪等国内CDN地址，如果你站点用户是国外的可以使用谷歌和微软。

使用 Staticfile CDN、百度、又拍云、新浪、谷歌或微软的 jQuery，有一个很大的优势：许多用户在访问其他站点时，已经从百度、又拍云、新浪、谷歌或微软加载过 jQuery。所以结果是，当他们访问您的站点时，会从缓存中加载 jQuery，这样可以减少加载时间。同时，大多数 CDN 都可以确保当用户向其请求文件时，会从离用户最近的服务器上返回响应，这样也可以提高加载速度。

---

jQuery 使用语法

jQuery 的使用功能，是通过选取（查询，query） HTML 元素，并对它们执行"操作"（actions），因此，其本质包含有选择器和事件行为。

jQuery 使用的语法是 XPath 与 CSS 选择器语法的组合。基础语法： $(selector).action()

• 美元符号 $ ：定义 jQuery
• 选择符（selector）："查询"和"查找" HTML 元素
• 事件行为 action() ：执行对元素的操作

demo $(this).hide() ： 隐藏当前元素

            
                    
                            
标题
        
第一行内容
        
第二行内容
        
第三行内容
        press        

demo $("p:nth-of-type(2)").hide()：隐藏第二个 <p> 元素

            
                    
                            
标题
        
第一行内容
        
第二行内容
        
第三行内容
        press        

demo $("p.test").hide()：隐藏所有 class="test" 的 <p> 元素

            
                    
                            
标题
        
第一行内容
        
第二行内容
        
第三行内容
        press        

demo $("#test").hide()：隐藏所有 id="test" 的元素

            
                    
                            
标题
        
第一行内容
        
第二行内容
        
第三行内容
        press        

---

Reference