jQuery笔记
jQuery 是一个 JavaScript 函数库
jQuery 库包含以下特性：
- HTML 元素选取
- HTML 元素操作
- CSS 操作
- HTML 事件函数
- JavaScript 特效和动画
- HTML DOM 遍历和修改
- AJAX
- Utilities
一、引入jQuery：
可以到jQuery官网http://jquery.com/download 下载js文件；然后在html中引入；
jQuery语法：
$(selector).action( )
$美元符号定义 jQuery选择符
（selector）“查询”和“查找” HTML 元素
jQuery 的 action( ) 执行对元素的操作
示例：
$(this).hide( ) - 隐藏当前元素
$("p").hide( ) - 隐藏所有段落
$(".test").hide( ) - 隐藏所有 class="test" 的所有元素
$("#test").hide( ) - 隐藏所有 id="test" 的元素
jQuery 元素选择器：
jQuery 使用 CSS 选择器来选取 HTML 元素。
$("p") 选取 <p> 元素。
$("p.intro") 选取所有 class="intro" 的 <p> 元素。
$("p#demo") 选取所有 id="demo" 的 <p> 元素。
jQuery 属性选择器：
jQuery 使用 XPath 表达式来选择带有给定属性的元素。
$("[href]") 选取所有带有 href 属性的元素。
$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。
jQuery 事件：
| $(document).ready(function) | 将函数绑定到文档的就绪事件（当文档完成加载时） |
| $(selector).click(function) | 触发或将函数绑定到被选元素的点击事件 |
| $(selector).dblclick(function) | 触发或将函数绑定到被选元素的双击事件 |
| $(selector).focus(function) | 触发或将函数绑定到被选元素的获得焦点事件 |
| $(selector).mouseover(function) | 触发或将函数绑定到被选元素的鼠标悬停事件 |
二、jQuery 效果：
1.隐藏/显示
语法：$(selector).hide(speed,callback);
$(selector).show(speed,callback);
可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是隐藏或显示完成后所执行的函数名称。
语法：$(selector).toggle(speed,callback);
使用 toggle() 方法来切换 hide() 和 show() 方法。显示被隐藏的元素，并隐藏已显示的元素。
2.淡入淡出
fadeIn( ) 淡入 语法：$(selector).fadeIn(speed,callback);
fadeOut( ) 淡出 语法：$(selector).fadeOut(speed,callback);
fadeToggle( ) 切换淡入淡出 语法：$(selector).fadeToggle(speed,callback);
fadeTo( ) 给定的不透明度（值介于 0 与 1 之间） 语法：$(selector).fadeTo(speed,callback);
3.滑动
slideDown( ) 向下滑动元素 语法：$(selector).slideDown(speed,callback);
slideUp( ) 向上滑动元素 语法：$(selector).slideUp(speed,callback);
slideToggle( ) 切换向上向下滑动 语法：$(selector).slideToggle(speed,callback);
4.动画
animate( ) 方法用于创建自定义动画
语法：$(selector).animate({params},speed,callback);
提示：默认地，所有 HTML 元素都有一个静态位置，且无法移动。
如需对位置进行操作，要记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute！
5.stop( )
语法：$(selector).stop(stopAll,goToEnd);
stop( ) 方法用于停止动画或效果，在它们完成之前。
stop( ) 方法适用于所有 jQuery 效果函数，包括滑动、淡入淡出和自定义动画。
三、jQuery HTML
1.获取内容
text（）设置或者返回所选元素的文本内容
html（）设置或返回所选元素的html内容（包含标签）
val（）设置或返回表单字段的值
2.获取属性
attr（）获取的是所选元素的直接属性
3.添加方法
append（）在被选元素内的结尾添加 添加多个元素用 ， 隔开
prepend（）在被选元素内的开头添加 添加多个元素用 ， 隔开
after（）在被选元素之后插入内容 添加多个元素用 ， 隔开
before（）在被选元素之前插入内容 添加多个元素用 ， 隔开
4.删除元素
remove（）删除被选元素（及其他的子元素） 删除的时候是彻底移除 还能接受参数进行过滤
empty（）删除被选元素的子元素 清空其子元素 本身不会清除
5.获取并设置css类
addclass（）向被选元素添加一个多个类 中间用 ， 隔开
removeclass（）删除一个多个类 中间用 ， 隔开
togglecalss（）进行添加/删除类的切换
caa（）设置或返回样式属性 一个或多个 他与attr相似 但是attr是返回的直接属性 css是返回的是样式
6.尺寸
width() height() 不包括内边距 边框 外边距
innerWidth() innerHeight() 包括内边距 不包括边框 和外边距
outerWidth() outerHeight() 包括内边距和边框 不包括外边距
outerWidth(true) outerHeight(true) 包括内边距和边框外边距
$(document).height()/width() 设置文档宽高
$(window).height()/width() 设置窗口宽高
三、jQuery 遍历
1.所有的父级
parent()返回被选元素的直接父级（爸爸）
parents()返回被选元素的所有的父级
arentUntil()返回介于俩个被选元素的之间所有的父级元素 但是不包括parentsUntli("div")括号里面的
2.所有的子级
childen()返回被选元素的所有的子级
find("div") 返回被选元素的所有div子级
find("*") 返回被选元素的所有子级
3.同胞 兄弟
siblings() f返回被选元素的所有兄弟元素
next() 返回被选元素的下一个兄弟元素
nextAll() 返回被选元素跟随之后的所有兄弟元素
nextUntil() 返回介于两个给定参数之间的所有跟随的同胞元素 不包括括号内的元素
prev(), prevAll() & prevUntil() 方法 是上的意思 与next() nextAll() nextUntli()相反 它们返回的是前面的同胞元素（在 DOM 树中沿着同胞元素向后遍历，而不是向前）。
4.过滤
first() 返回被选元素的首个元素
last() 返回被选元素的最后一个元素
eq() 方法返回被选元素中带有指定索引号的元素。索引号从 0 开始，因此首个元素的索引号是 0 而不是 1。下面的例子选取第二个 <p> 元素（索引号 1）
