jQuery的引入与方式与工厂函数$使用方式-2018年4月3日

对于痛苦的原生javascript来说，jQuery可谓神器

看一下jQuery的理念就知道，选择他是对的：写得少，做的多

实际应用中jQuery有两种使用方法，也就是引用方式，下面简单介绍一下：

第一种方法：线上引用

非常简单，只需要记住两个关键词即可，一是“静态资源公共库”、二是“jQuery”

记住这两个词的目的很简单，就是让你在“百度”、“谷歌”等搜索引擎来找到它

下面以百度静态库举例

进入百度www.baidu.com 输入“静态资源库” 搜索出现如下页面

点击进入，并在搜索框中输入“jQuery”

复制如下链接 http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js

打开编辑器，在<script>标签中的src属性下输入刚才复制的链接进行引用，如下所示：

第二种方法：本地引用

首先下载jQuery，然后调用，步骤如下：

找到jQuery官网 https://jquery.com/ 国外网站，访问较慢，请耐心等待

然后点击右侧的 download jQuery v n.n.n  后面这个是版本号，进入如下页面：

会出现三个下载链接供你选择，初学者一般选择第二个“uncompressed development”版本

将下载文件保存到你项目的js文件夹下，然后再用script标签下的src将其引入即可，具体参照方法一

说到这里，对于jQuery的引入位置我们应该重新梳理一下，因为我们看到引入位置可以放在头部，又可以放在底部，那到底应该怎么理解这个引入呢。首先我们应该明白，代码是按照自上而下的顺序执行的，理论上讲我们把所有的页面元素加载完成之后，再将其进行特效渲染，是这么个顺序，所以放在底部是没有问题的，所以这里我们就不讲放在底部的问题了，我们来谈一下如何将jQuery放在头部还能正常使用的方法。

方法一：window.onload====页面元素全部加载完成后再执行，传统，要等待页面所有信息的加载，对于页面元素较多的网站来说，客户的体验会受到影响。

方法二：也是我们着重要说的方法，jQuery中自由的方式，$(document).ready()，特点是先将页面中的DOM结构加载完就会触发，优点就是客户只需要很少的流量资源就可以有较好的体验。而作为js中“神器”的存在，jQuery还对其有更友好的书写方式，那就是省略(document).ready，直接将函数传入$()下。