jQuery

补充: 
*$obj.eq(i)等价于$($obj[i])  返回的是jQuery对象
*$(function(){});==windos.οnlοad=function(){};
  写多次onload 后者会覆盖前者 $(function(){})则不会
                                                    
1.jQuery是一个轻量级(低耦合度)的JS库,是一个优秀的JS框架
2.jQuery使用步骤:
    *引入jQuery文件
    *使用选择器选中节点
    *调用API操作节点
3.*jQuery对象本质上是DOM数组(类数组,假数组)
   *jQuery对象只能调用jQuery的API
   *jQuery对象可以转换成DOM对象
4.大致规律
    *选择器选中的是jQuery对象
    *jQuery的API若返回的是节点,是jQuery对象(有例外)
    *jQuery的API若返回的是值,通常是String
5.jQuery选择器
   1)基本选择器
       *元素选择器:$("标签名")
       *类选择器:$(".class属性名")
       *id选择器:$("#id")
       *选择器组:$("#id,.importent")
   2)层次选择器
       *子孙元素:$("元素1 元素2")
       *子元素:$("元素1>元素2")
       *下一个弟弟:$("元素1+元素2")
       *所有弟弟:$("元素1~元素2")
   3)过滤选择器
       *基本过滤(重点):
         :first 第一个元素 :last 最后一个元素  :even 偶数行  :odd 奇数行 
         :not(过滤选择器 ) 选择指定选择器外的所有元素
         :eq(index) 下标等于index的元素 :gt(index) 下标大于index的元素 :lt(index)下标小于index的元素
       *内容过滤:根据文本内容定位
          :contains(text) 匹配包含给定文本的元素   :empty 匹配所有不包含文本或子元素的空元素
       *可见性过滤:根据可见性定位
          :hidden 匹配所有不可见的元素或者type为hidden的 :visible 匹配所有的可见元素
       *属性过滤:根据属性定位
         [属性]  匹配具有给定属性的元素  [属性=value ] 匹配具有给定属性 并且值等于value的元素
         [属性!=value ] 匹配具有给定属性 并且值不等于value的元素
       *状态过滤:根据状态定位
          :enabled 匹配所有可用的元素  :disabled 匹配所有不可用的元素  :checked 匹配所有选中的checkbox :selected 匹配选中的option
   4)表单选择器 根据input的type来定位元素
       :text , :password , :checkbox , :radio , :submit , :reset , :button , :file , :hidden
6.jQuery操作DOM
   1)读写节点:
       *obj.html/obj.html("..."); 读/写节点的HTML内容
       *obj.text()/obj.text("..."); 读/写节点的文本内容
       *obj.val()/obj.val("..."); 读/写节点的value属性值
       *obj.attr("属性名")/obj.attr("属性名","属性值"); 读/写节点的属性值
   2)增删节点
     *创建节点:$("节点内容");
     *插入节点: 父元素.append(obj); 做为最后一个节点添加 父元素.prepend(obj); 做为第一个节点添加
                            兄弟元素.after(obj); 做为下一个兄弟节点添加 兄弟元素.before(obj); 做为上一个兄弟节点添加
     *删除节点: obj.remove(); 删除节点 obj.empty(); 清空节点      
   3)样式操作
       *addClass("");追加指定样式
       *removeClass("");移除指定样式
       *removeClass();移除所有样式
       *toggleClass("");切换样式
       *hasClass("");判断是否有某个样式
       *css("");读取css的值
       *css("","");设置多个样式
   4)遍历节点
       *children()/children(选择器); 所有的子节点
       *next()/next(选择器); 下一个兄弟节点
       *prev()/prev(选择器); 上一个兄弟节点
       *siblings()/siblings(选择器); 所有兄弟
       *find(选择器); 查询满足选择器的所有后代
       *parent();父节点
7.事件处理
     1)事件后绑定:$obj.bind("事件类型",事件处理函数) 简写:$obj.事件类型(函数)
     2)获取event对象:浏览器会自动传入event,为事件处理函数传个参接收即可
     3)获取事件源:e.target
     4)event对象常用属性:e.pageX/e.pageY
8.取消事件冒泡: e.stopPropagation();    
9.合成事件:
    *hover(mouseenter,mouseleave) 模拟光标悬停 设置的时候传入两个事件处理函数
    *toggle();  在多个事件响应中切换(在显示和隐藏之间切换)
10.模拟操作(电脑代替人的行为触发某些事件)
      *$obj.trigger("事件类型") 简写形式:$obj.事件类型();
11.jQuery动画
     1)显示,隐藏的动画效果(逐渐虚化)
         *$obj.show(动画的执行时间,动画执行完后要执行的函数)   $obj.hide()
     2)上下滑动(无虚化的显示隐藏)
      *slideDown() / slideUp() 用法同显示,隐藏
     3)淡入淡出
        *fadeIn() / fadeOut() 用法同显示,隐藏
     4)自定义动画
         *动画基于定位,通常都采用相对定位,永远以原始位置为目标设置偏移量
         *animate(动画移动路径,动画执行时间,动画执行完后要执行的函数)