jQuery语法
（1）引用jquery文件及下载库：
下载
Download the compressed, production jQuery 2.2.2
这个是用户版的，已经被精简和压缩。
然后使用
<script src="jquery.js"></script>
来启动这个库文件，记得将下载的文件重命名为jquery.js
也可以使用谷歌和微软的CDN，不过这里略。
（2）jQuery语法
$ (selector).action()
其中$是必须的，表示使用jQuery语法；
selector表示你要对哪个进行操作；
action()表示进行的操作；
例如：$(“div”).hide() 其表示对所有div标签包含的内容进行隐藏，如果是<”p”>则表示对p标签包含的东西进行隐藏。
其他：
$(this) 表示对当前HTML元素进行操作
$(“#abc”) 表示对id为abc的元素进行操作
$(“.abc”) 表示对class=”abc”的进行操作
（3）$(document).ready
这个存在的意义在于，只有当文档加载完毕（不确定是指所有文档，还是指使用的文档的那一部分），才能运行jQuery代码
（4）选择器
①$(“p”) 选择元素为<p>的
②$(“p.abc”) 选择class=”abc”的<p>元素
③$(“p#abc”) 选择id=”abc”的<p>元素
④$(“[href]”) 选择所有带有href属性的元素
⑤$(“[href=’#’]”) 选择所有带href值等于“#”的元素
⑥$(“[href!=’#’]”) 选择所有带href值不等于“#”的元素
⑦$(“[href$=’.jpg’]”) 选择所有带href，末尾以.jpg结尾的元素
more：
| 语法 |
描述 |
| $(this) |
当前 HTML 元素 |
| $("p") |
所有 <p> 元素 |
| $("p.intro") |
所有 class="intro" 的 <p> 元素 |
| $(".intro") |
所有 class="intro" 的元素 |
| $("#intro") |
id="intro" 的元素 |
| $("ul li:first") |
每个 <ul> 的第一个 <li> 元素 |
| $("[href$='.jpg']") |
所有带有以 ".jpg" 结尾的属性值的 href 属性 |
| $("div#intro .head") |
id="intro" 的 <div> 元素中的所有 class="head" 的元素 |
（5）事件触发条件
①ready是完成后触发，一般用于文档。$(document).ready(执行的命令)
②click是点击后触发，一般用于按钮，也可以用于点击文档某区域。$(selector).click(执行的命令)
③dclick是双击后触发。$(selector).dclick(执行的命令);
④focus是元素获得焦点时触发的事件；
⑤mouseover是鼠标悬停后触发的事件；
更多事件触发参考：
http://www.w3school.com.cn/jquery/jquery_ref_events.asp
（6）名称冲突
例如jQuery和某个库名称冲突了（例如同样适用$符号作为开始），那么使用这个命令；
var jq=jQuery.noConflict()，帮助您使用自己的名称（比如 jq）来代替 $ 符号。
（7）解释
$(document).ready(function(){
$(".ex .hide").click(function(){
$(this).parents(".ex").hide("slow");
});
});
第一行是，当文件准备好了，执行函数，函数内容是后面的：
第二行是，class=”ex”的元素中的class=”hide”元素，点击后触发函数，函数内容为第三行；
第三行是，当前元素（this）的所有祖先元素（parents，一直到根元素html为止）中class=”ex”的元素，被隐藏（hide），速度为缓慢（slow）
疑问：
当有两个同样的东西时，为什么只隐藏自己当前这个，不隐藏另外一个？
推测是因为只遍历其祖先，不包含自己（且祖先中符合class=”ex”要求的）
（8）隐藏和显示
隐藏是hide()，而显示对应的是show()，
只要将隐藏的hide()改为显示的show()即可。
还可以规定速率：
速率有三种，slow（慢），fast（快），数字（毫秒）。
例如hide(“slow”); show(“fast”); hide(2000);
需要注意的是：无参数为瞬间完成，fast为快（但比瞬间慢），slow为慢，数字无需加引号。
另有toggle，用法同show和hide，效果是，如果是隐藏，点击后显示，如果是显示，点击后隐藏。也可以加时间和速度参数。
问题：假如多次点击，他会执行完每一次的行为，而不是只执行最近一次
（9）淡入和淡出
注意大写，对大小写是敏感的。
fadeIn(); //淡入（显示）
fadeOut(); //淡出（隐藏）
fadeToggle(); //类似toggle，如果隐藏则显示，如果显示则隐藏
fadeTo(速度, 透明度0~1, 返回函数); //可以调整不透明度，注意，不能大于1
如：
$("#img_1st").fadeTo(1000,0.3);
以1000ms的速度，将id=”img_1st”的东西设置为透明度30%
注：
假如有多个淡入同时执行，则分别执行自己的，而不是逐个执行。除非有设置设置其执行顺序。
更多特效参考；
http://www.w3school.com.cn/jquery/jquery_ref_effects.asp
（10）滑动
说明：非隐藏的情况下，滑动后就是隐藏了，隐藏的情况下，相反的滑动就是显示。
向上滑动：slideUp();
向下滑动：slideDown();
切换滑动（先向上，再点击则向下）：slideToggle()
其他效果：
http://www.w3school.com.cn/jquery/jquery_ref_effects.asp
（11）显示
display:none;
在css的style设置，这种设置为初始不显示。
（12）动画
$(selector).animate({params},speed,callback);
第一个是必须是，表示形成动画的CSS属性，简单的来说，例如初始字号大小为10px，然后这里填写50px，那么字体就会自动变为50px（这个变化的过程就是动画）
注意：
①这个可以操纵块，但是似乎是不能操作<p>标签。
②可以操纵CSS属性；
③移动位置的话，需要在style里这么设置：position:fixed
一些使用：
$(document).ready(function(){
$("#b_3rd").click(function(){
$("#a_3rd").animate(
{left:'550px', //左边的位置变为550px
width:'100px', //宽度变为100px
top:'-=200px', //向上的位置减少200px
fontSize:'50', //设置字体大小（注意没有-），并且S大写
});
});
});
并且由于top使用的是相对位置，因此每次点击top，都会移动位置
还可以设置为属性，例如：
width:’toggle’ //宽度形式的隐藏和显示切换
hide隐藏show显示。
不过貌似不能淡入淡出和改变透明度，是因为淡入淡出本身就是动画么？
队列：
$(document).ready(function(){
$("#b_3rd").click(function(){
$("#a_3rd").animate({left:'550px'}); //左边的位置变为550px
$("#a_3rd").animate({width:'100px'});//宽度变为100px
$("#a_3rd").animate({top:'-=200px'});//向上的位置减少200px
$("#a_3rd").animate({fontSize:'50'});//设置字体大小（注意没有-），并且S大写
});
});
这种写法就是让其按顺序执行先移动位置，然后宽度变化，然后往上移动，再字体变大
（13）停止动画
语法：
$(selector).stop(stopAll,goToEnd);
假如有动画队列1、2、3、4，正在执行1；
默认无参数是1停止，下来执行2，3，4；
第一个参数存在表示1、2、3、4都停止；
第二个参数表示1停止，但是立刻出结果
参数用true和false来表示。
①false, false表示1停止，执行2、3、4；
②false, true表示直接完成1，然后执行2，3，4；
③true, false表示1停止，234取消；
④true,true 表示1直接出结果，然后其他停止；
如代码：
<div style="position:fixed" id="a_3rd">
<p>用于测试动画的文字</p>
</div>
<div>
<p style="text-align:center">
<button id="b_3rd" align="center">点击后左面的文字会移动</button>
<button id="b_4th" align="center">点击停止旁边按钮的动画</button>
</p>
</div>
以下是对其进行操作：
$(document).ready(function(){
$("#b_3rd").click(function(){
$("#a_3rd").animate({left:'550px'},2000); //左边的位置变为550px
$("#a_3rd").animate({width:'100px'},2000);//宽度变为100px
$("#a_3rd").animate({top:'-=200px'},2000);//向上的位置减少200px
$("#a_3rd").animate({fontSize:'50'},2000);//设置字体大小（注意没有-），并且S大写
});
$("#b_4th").click(function(){
$("#a_3rd").stop(true); //停止其的一切动画队列
});
});
（14）CallBack函数
称为回调函数，
其作用是，当前动画执行完100%后，执行该函数。
可以理解为，当某条件满足之后，执行该函数。
（15）AJAX方法（异步请求）
具体来说，是load()方法，语法是：
$(selector).load(URL,data,callback);
例如读取某个链接或者本地文件：
$("#a_3rd").load("a.txt"); //这是标签为#a_3rd的读取文本文档a.txt
①URL是希望加载的URL（链接）；
②data参数规定与请求一同发送的查询字符串键/值对集合（不懂，感觉是说这个是查询的时候顺便发个信息给对方）；
③callback是结束请求后执行的函数；
可以在URL里面加入选择器（例如#是选择id的，.是选择class的），来选择某一部分的内容（例如js文件的某个标签的）。
如：
load('/example/jquery/demo_test.txt #p1') //读取id=”p1”的标签内的
也可以把#p1改为h2，读取h2标签内的
load的返回值（注意大小写）：
responseTxt 包含调用成功时的结果内容
statusTxt 包含返回状态，如果成功是success，如果失败是error
xhr 包含XMLHttpRequest对象（不懂）
（16）get和post——两种http请求方法
get——从指定的资源请求数据；
post——向指定的资源提交要被处理的数据；
GET方法：
查询字符串（名称/值 对）是在GET请求的URL中发送的；
①GET请求可被缓存；
②GET请求保留在浏览器历史记录中；
③GET请求可被收藏为书签；
④GET请求不应在处理敏感数据时使用；
⑤有长度限制；
⑥只应当用于取回数据；
POST方法：
①不会被缓存；
②不会被保存在浏览器记录中；
③不能被收藏为书签；
④对数据长度没有要求；
|
|
GET |
POST |
| 后退按钮/刷新 |
无害 |
数据会被重新提交（浏览器应该告知用户数据会被重新提交）。 |
| 书签 |
可收藏为书签 |
不可收藏为书签 |
| 缓存 |
能被缓存 |
不能缓存 |
| 编码类型 |
application/x-www-form-urlencoded |
application/x-www-form-urlencoded 或 multipart/form-data。为二进制数据使用多重编码。 |
| 历史 |
参数保留在浏览器历史中。 |
参数不会保存在浏览器历史中。 |
| 对数据长度的限制 |
是的。当发送数据时，GET 方法向 URL 添加数据；URL 的长度是受限制的（URL 的最大长度是 2048 个字符）。 |
无限制。 |
| 对数据类型的限制 |
只允许 ASCII 字符。 |
没有限制。也允许二进制数据。 |
| 安全性 |
与 POST 相比，GET 的安全性较差，因为所发送的数据是 URL 的一部分。 在发送密码或其他敏感信息时绝不要使用 GET ！ |
POST 比 GET 更安全，因为参数不会被保存在浏览器历史或 web 服务器日志中。 |
| 可见性 |
数据在 URL 中对所有人都是可见的。 |
数据不会显示在 URL 中。 |
GET语法：
$.get(URL,callback);
URL是必须有的，表示链接；
callback是 请求成功 后执行的回调函数；
POST语法：
$.post(URL,data,callback);
data是连通请求发送的数据。
以下是收集的资料：
（1）GET用于信息获取，而且应该是安全的和幂等的。
“安全”大概意思是：
①不安全的信息（敏感的信息）不应该由GET获取；
②GET主要用于获取信息，而非修改信息；
③GET请求一般不应产生副作用；
“幂等”大概意思是：
①对同一个URL的多次请求的结果是相同的。
例如想要获得一个信息，多次请求，应该总能获得这个信息（而非突然变为另外一个信息）；
GET请求的数据会附在URL之后（把数据放在HTTP协议头中），以“?”分割URL和传输数据，参数之间以“&”相连，如：
login.action?name=hyddd&password=idontknow&%E4%BD%A0%E5%A5%BD
如果数据是英文字母/数字，则原样发送；
如果是空格，则转换为+；
如果是中文/其他字符，则把字符串用BASE64加密，得出%E4%BD%A0%E5%A5%BD，其中%XX中的XX为该符号以16进制表示的ASCII值
（2）POST表示可能改变服务器上的资源请求
①例如对某论坛的帖子进行回帖，服务器上的该贴多了一个回帖。因此应该通过POST来实现；
POST把提交的数据放置在HTTP包的包体之中。
（3）因此，POST的安全性（关于丢失敏感信息）比GET高，传输的数据更多一些，但是更复杂一点（因为data属性，要发一个表单）。
