扩展：hiede（）：隐藏 show（）：显示
1、简介：是一个对javascript进行了封装的库，简化了用户使用javaScript，是js库
2、特点：写的少、做的多
3、使用方法：
（1）在页面中引入jQuery库：引入外部的js文件
（2）‘$’:jQuery的全局对象，代表jQuery
（3）$(function(){})：jQuery的入口函数。原始写法：
$(document).ready(function(){})==window.onload
简写为：$(function(){})
二、jQuery的选择器：是jQuery的核心
1、基本选择器：
（1）id选择器：$('#id')
（2）类选择器：$('.class')
（3）标签名选择器：$('标签名')
（4）通配符（*）选择器：$(' * ')
（5）合并选择器：$('#id,.class,.....')
情调：css（）函数的作用：是jQuery用于设置元素CSS样式的函数
a、css('样式属性名'，'属性值')：设置单个样式
b、css({属性名1：‘属性值1’，属性名：‘属性值2’······})
eq（index）函数：匹配一个给的索引值的元素。页面中元素的索引值从0开始
列如：
<pid="one">八百里秦川</p>
<script>
$(function() {
$('#one').css('background', 'red')
$('#one').css({
color: 'red',
background: 'green'
})
})
</script>
2、过滤选择器：通过特定的过滤规则来筛选出所需的DOM元素。所有的过滤选择器都有“ ： ”开头
2.1、基本过滤选择器
（1）：first······选择第一个元素
（2）：last······选择最后一个元素
（3）：not(selector)·····去除所有与给定选择器相匹配的元素
（4）：even·····匹配索引值为偶数的元素，从0开始计数
（5）：odd····匹配索引值为奇数的元素，从0开始计数
（6）：eq(index)·····匹配给的索引值的函数
（7）：gt(index)·····匹配大于给定索引值的元素
（8）：lt(index)····匹配小于给定索引值的元素
2.2、内容过滤选择器
（1）：contains(text)····匹配包含文本的元素
（2）：empty····匹配所有不包含所有子元素或空元素
（3）：has(selector)·····匹配含有元素的元素
（4）：parent······匹配包含有子元素或者文本的元素
（5）val():jQuery的函数，若不带参数表示获取 input标签的value属性值
（6）val(参数)：带上参数，就是将参数赋给input标签的value属性
2.3 可见性选择器
（1）：hidden····匹配所有不可见元素，或者type为hidden的元素，也包含文本隐藏域input type=‘hidden’和visibale： hidden
（2）：visibale···匹配所有可见的元素
2.4、属性过滤选择器：
表达式：a、$('标签名[属性名]')：标签是否含有给定的属性
b、$('标签名[属性名=值]')
（1）[attribute]····匹配包含指定属性的元素
（2）[attribute=value]····匹配给定的属性是某个特定值的属性
（3）[attribute！=value]······不含有指定的属性，或者属性不等于特定值的元素
（4）[attribute^=value]····匹配给定的属性是以某些值开始的元素
（5）[attribute$=value]····匹配给定的属性是以某些值结尾的元素
（6）[attribute*=value]·····匹配给定的属性包含的属性
<inputtype="hidden"value="VIP">
<br><br>
<inputtype="hidden"value="VIP"id="in"disabled>
<br><br>
<divclass="d1">华山</div>
<divtitle="one">泰山</div>
<divclass="d1">恒山</div>
<divtitle="two">黄山</div>
<divclass="d1">衡山</div>
<ptitle="abc-123">黄鹤楼</p>
<ptitle="abc-456">岳阳楼</p>
<ptitle="aaef">滕王阁</p>
<ptitle="axafff">鹊雀楼</p>
<script>
$(function() {
lett=$('input:hidden').val()
console.log(t);
$('#in').val('蜗牛学苑')
//匹配含有class属性的div
$('div[class]').css('color', 'blue')
//[attribute=value]····匹配给定的属性是某个特定值的属性
$('div[title=one]').css('color', 'red')
匹配title属性不是aaef的属性
$('p[title!=aaef]').css('color', 'red')
匹配开头属性值以abc开头的
$('p[title^=abc').css('color', 'blue')
$('p[title$=ef').css('color', 'aqua')
})
</script>
3、子元素选择器：索引值从一开始
（1）:firstChild····匹配第一个子元素
（2）:lastChild···匹配最后一个子元素
（3）:nth-child
a、:nth-child（event/odd）：选取每个父元素下的索引值为奇数或者偶数的元素
b、:nth-child（2）取每个父元素下的索引值为2的倍数
c、:nth-child（3n）取每个父元素下的索引值为3的倍数
<ul>
<li>宋江</li>
<li>李逵</li>
<li>柴绍</li>
<li>武松</li>
</ul>
<script>
$(function() {
$('li:first-child').css('color', 'red');
$('li:last-child').css('color', 'aqua');
$('li:nth-child(even)').css('fontSize', '20px');
$('li:nth-child(3n)').css('fontSize', '40px')
})
</script>
4、表单选择器：
（1）:text····单行文本框
（2）:password····密码框 等等
二、jQuery的属性：利用jQuery来操作标签的属性
1、操作属性：
（1）attr（name）：获取属性值。参数name是属性名
（2）attr（key，fn）：用来修改属性值。key代表属性名，fn代表一个函数，将该函数的返回值作为key属性的值
（3）attr（key，value）：修改属性值。将value的值赋给key
（4）removeAttr（name）：删除属性
2、操作样式：
（1）css（key，value）、css（{‘属性名1’：‘属性值1’，‘属性名2’：‘属性值2’}）
（2）addClass(class|fn)：为匹配的元素添加指定的类名
（3）removeClass（[class|fn]）为匹配的元素删除指定的类名
参数可以为类名，也可以是函数（将函数的返回值作为类名）
（4）toggleClass(class|fn)：如果所匹配的元素存在某个类就删除，反之添加
3、获取元素的宽度和高度
（1）width（）：获取元素的宽度
（2）width（value）：表示设置元素的宽度
（3）height（）：获取元素的高度
（4）height（value）设置元素的高度
4、操作元素的内容
（1）html（）：获取匹配元素的内容（底层使用的元素innerHTML属性。可以识别标签）
（2）html（value）：设置元素的值（可以识别标签）
（3）text()：匹配元素的文本（底层使用的元素innerHTML属性）
（4）text(value)：设置匹配元素的文本（不能识别标签）
5、操作值
（1）val（）：获取匹配元素的value属性值
（2）val(args）设置匹配元素的value属性值
6.查找
（1）add（）：
（2）find（exp）：搜索所有与指定表达式匹配的元素
（3）first（）：获取第一个元素
（3）last（）：获取最后一个元素
（4）hasClass(class）：检查当前的元素是否含有某个特定的类，如果有，返回true
强调：在jQuery代码中使用this的方法·····$（this）对表当前指定的元素
三、筛选：
1、children:获取所有的子元素
2、find（exp）：查找给定表达式的查找
3、next（exp）：获取匹配元素的紧邻的同辈元素
4、next All（exp）：查找匹配元素的同辈元素
5、parent（exp）：取得一个包含所有匹配元素的唯一父元素的集合
6、parents（exp）：取得一个包含所有匹配元素的唯祖先元素的元素集合
7、prev（exp）：获取匹配元素紧邻的上一个同辈元素
8、prevAll（exp）：查找当前元素之前所有的同辈元素
9、siblings（exp）：取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合
四、jQuery的自定义动画
1、animate（perams，[speed]，[easing]，[fn]）
params:一组包含作为动画属性和终值的样式属性和及其值的集合
speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如：1000)
easing:要使用的擦除效果的名称(需要插件支持).默认jQuery提 供"linear" 和 "swing".
fn:在动画完成时执行的函数，每个元素执行一次。
jQuery的对象访问
2、index（[selector]：获取页面元素的索引值，索引值从0开始
五、jQuery的事件处理：
1、事件绑定：
bind（type，[data，fn]）：给匹配元素的事件绑定事件处理函数
参数type：事件类型
参数data：作为event。data传递事件处理程序的数据对象
参数fn：事件处理程序
2、模拟鼠标悬停事件：当鼠标悬停到目标对象上方、离开目标对象时触发
hover(over，out)：
参数over：鼠标悬停到目标上方时触发
参数out：鼠标离开目标对象时触发
强调;在jQuery的应用中如果某个对象同时会触发mouseover、mouseout事件，建议使用hover模拟鼠标悬停事件
one（type，[data]，fn）：为匹配的元素绑定一个一次性的事件处理函数
unbind（type，[data|fn]）:反向操作，删除绑定事件
on（events，[selector]，[data]，fn）：再选则元素上绑定一个或多个事件的事件处理函数
参数events：一个或多个用空格分隔的事件类型
off（events，[selector]，[data]，fn）：再选则元素上删除一个或多个事件的事件处理函数
3、事件类型：
（1）click：鼠标单击
（2）blur：失去焦点
（3）focus：获得焦点
（4）change：当元素的值发生改变时会发生change事件
六、jQuery的动画
1、显示/隐藏：
show（）：显示
hide（）：隐藏
交替显示/隐藏：toggle（speed）若匹配的元素显示了就隐藏，反之显示
2、向下收缩/向下展开：
向上收缩：slideUp（speed，[easing],[fn]）
向下展开：slideDown（speed，[easing],[fn]）
交替收缩、展开：slideToggle（speed，[easing],[fn]）
3、淡入淡出
fadeIn（[speed]，[easing]，[fn]）淡入
fadeOut（[speed]，[easing]，[fn]）淡出
fadeToggle（[speed]，[easing]，[fn]）：交替淡入、淡出
