2018-02-05（jQuery）

1.

选择器

$("ul li:first")	选取第一个 <ul> 元素的第一个 <li> 元素	在线实例
$("ul li:first-child")	选取每个 <ul> 元素的第一个 <li> 元素	在线实例
$("[href]")	选取带有 href 属性的元素

$("a[target='_blank']")	选取所有 target 属性值等于 "_blank" 的 <a> 元素	在线实例
$("a[target!='_blank']")	选取所有 target 属性值不等于 "_blank" 的 <a> 元素

$(":button")	选取所有 type="button" 的 <input> 元素 和 <button> 元素	在线实例
$("tr:even")	选取偶数位置的 <tr> 元素	在线实例
$("tr:odd")	选取奇数位置的 <tr> 元素

2.

事件：

鼠标事件	键盘事件	表单事件	文档/窗口事件
click   //点击元素事件	keypress   //键被按下	submit  //提交	load   //加载
dblclick  //双击元素	keydown  //键按下的过程	change  //改变内容	resize   //重置窗口
mouseenter  //鼠标移入	keyup  // 键被松开	focus	scroll   //滚动次数
mouseleave   //鼠标移出		blur	unload   //

3.

3.1

click() //点击

dblclick() //双击

mouseenter() //鼠标移入

mouseleave() //鼠标移开

mousedown() //按下鼠标

mouseup() //松开鼠标

3.2。隐藏、显示

hide() 和 show() //隐藏、显示

toggle() //隐藏和显示

3.3。淡入、淡出

fadeIn()  //淡入

fadeOut() // 淡出

fadeToggle() //淡入和淡出

fadeTo() //颜色变淡

3.4.

slideDown() //滑出

$(document).ready(function(){
　　$("#flip").click(function(){
　　$("#panel").slideDown("slow");
　　});
});

slideUp() //滑进

slideToggle()  //滑出、滑进

3.5.动画

3.5.1.animate()  //创建自定义动画

$(document).ready(function(){
　　$("button").click(function(){
　　　　$("div").animate({
　　　　　　left:'250px',
　　　　　　opacity:'0.5',
　　　　　　height:'150px',
　　　　　　'100px'
　　　　});
　　});
});  // 使用 paddingLeft 而不是 padding-left，使用 marginRight 而不是 margin-right

3.5.2

$(document).ready(function(){
　　$("button").click(function(){
　　　　$("div").animate({
　　　　　　height:'toggle'
　　　　});
　　　});
});  // 相当于滑入、滑出

3.5.3

$(document).ready(function(){
　　$("body").mouseenter(function(){
　　var div=$("div");
　　div.animate({left:'100px'},"slow");
　　div.animate({fontSize:'55px'},"slow");
　　div.animate({fontSize:'25px'},900);
　　});
});  // 一步步改变样式