jQuery是在全世界都非常流行的javascript代码库，以一款快速、简洁的js框架。它的宗旨就是"write less,do more"；写的少，做的多。
#例子
$(function() {//手风琴效果
$('#main li').hover(function(){
$(this).stop(true).animate({
'width':'400px'
}).siblings().stop(true).animate({
'width':'160px'
});
},function(){
$(this).stop(true).animate({
'width':'200px'
}).siblings().stop(true).animate({
'width':'200px'
});
})
});
这是用jQuery写的代码，仅仅十行不到，就可以写出一个简单的手风琴效果。这是用原生js无法做到，但不是说原生js就没用了，只是jQuery把我们常用的效果和一些重复的操作封装在一起。
#jQuery选择器
- ####css选择符 在jQuery中，它给我们提供了强大的DOM元素查找方式。
$('#main li')//这里我们用了ID选择器和后代选择器，找到了#mian的子元素li
当然，并不只有以上这种方式，它允许我们直接使用css的所有选择器来找到你所要的元素。
- ####自定义选择符 jQuery独有的自定义选择符，进一步增强已经十分强大的css选择符。它的语法与css的伪类选择符非常相似。
- 例如，我们要找一堆li元素中的第二个元素，可以这样：
$('li:eq(1)')//在js中索引都是从0开始。
- 如果用css选择符的方式，就是这样：
$('li:nth-child(2)')//同样能选择到第二个li。因为使用的是css的方式，所以是从1开始。
- :even选择符
选择元素中的奇数元素，因为在js中是0开头，虽然翻译为偶数，但实际上选择的是奇数元素。```
- :odd选择符
同理，这个选择的是偶数元素
- :contain选择符
$('p:contain(abc)')//选中所有包含文本abc的元素，区分大小写。
- ####表单选择符
- :input选择符
选中所有的input元素
- :button选择符
选中按钮元素
- :checked选择符
选中被选取的元素
通过判断选中的元素个数，我们可以很方便的做全选效果。
#jQuery方法
- hasClass()
选中含有class类名的元素。
- addClass()
给选中的元素添加一个class样式。
- removeClass()
给选中的元素删除一个class样式。
- toggleClass()
切换class样式，没有就添加，有就移除。
- css()
一个参数时获取选中元素的css样式，两个时为设置样式。
<small>以上仅仅是一点点。</small>
#jQuery连缀
大部分jQuery方法都能返回jQuery对象，所以我们可以连续使用多个方式。
$(this).addClass('active').siblings().removeClass('active'); //在每个方法后再继续添加方法.
以下是完整的事例：
(function(){ //1.楼梯什么时候显示，scroll--->scrollTop (window).on('scroll',function(){ var (this).scrollTop() if(scroll>800){ ('#loutinav').show(); }else{ ('#loutinav').hide(); } ('.louti').each(function(index){ var ('.louti').eq(index).offset().top-400; //console.log(loutitop) if(scroll){ ('#loutinav li').eq(index).addClass('active').siblings().removeClass('active'); //return false; } }) }) ('#loutinav li').not('.last').on('click',function(){ //除了类名为last的li添加点击事件。 loutitop=(this).index()).offset().top; ('body,html').stop(true).animate({ scrollTop:loutitop }) }) ('.last').on('click',function(){ ('body,html').stop(true).animate({ scrollTop:0 }) }) })
