jQuery方法

入口函数  $(function(){})   
               全写： $(document).ready(函数)
    
jq对象转js对象 加索引
            var $li = $("#li");
            console.log($li);
            $li[0].style.color="pink"

js转化jq对象
            var li = document.getElementById("li");
            $(li).text("哈哈");//给钱就可以

基本选择器：类选择器  $("#id")
                   id选择器  $(".class")  
       标签选择器  $("标签名")
                   并集选择器  $("div,p,li")
                   交集选择器  $("div.redClass")

层级选择器：子集  $("ul>li")
                    后代  $("ul li ")

过滤选择器：
    :odd 索引为基数   
    :even  索引为偶数  
    :eq()指定下标

筛选选择器
    .first 
    .last  
    .next  找下一个兄弟
    .prev  找上一个兄弟
    .parent  查找父亲
    .children()  子代选择器
    .find()  后代选择器
    .siblings()  查找兄弟节点，不包括自己本身
    .eq()       index获取当前索引
  
css操作  .css()
    设置单个样式   .css(样式名，样式值)
    设置多个样式  .css({"样式名"："样式值"，"样式名"："样式值"})

class操作： 
    addClass()   添加类
    removeClass()   移出类
    hasClass()   判断类
    toggleClass()   切换类

属性的操作：
    .prop()
    .attr()

关于布尔类型的属性, 不要用attr方法,  用 prop()方法, 用法跟attr是一样的

show([speed], [callback]) , [] --->可选参数
speed : 动画持续时间,  可以是毫秒, 也可以是固定字符串: fast: 200ms  normal: 300ms  slow: 600ms
callback : 回调函数, 动画完成后执行
 
三组动画  
    显示：show()
    隐藏 ：hide（）
    淡入：fadeIn   
    淡出 : fadeOut  
    切换 : fadeToggle
    滑入 : slideDown   
    滑出: slideUp   
    切换 : slideToggle

mouseover：鼠标经过事件
mouseout:鼠标离开事件
      
mouseenter:鼠标进入事件
mouseleave：鼠标离开事件

自定义动画
语法:  jq对象.animate(style , [speed] , [动画的执行效果], [callback])
        ① : 必选, 传需要动画的样式,  传对象
        ② : 持续时间
        ③ : 动画的执行效果  swing :秋千   linear : 匀速
        ④ : 回调函数

append()  添加到父节点里面的末尾
appendTo()  把子节点添加到父节点的末尾

把子元素添加到父节点里面的前面 :  prependTo()
在父元素里面添加一个子节点到最前面:  prepend()

添加兄弟节点  
    after() 兄弟之后    
    before()兄弟之前

empty()  清空
remove()  删除
clone()   克隆

获取value值
    .val()       $("input").attr("value")
    .attr()      $("input").val()

获取焦点input里面的value值为空，失去焦点时还原
    .focus()   获取焦点
    .blur()   失去焦点

text()和html()方法
    获取  $("div").text()  文本内容
                    $("div").html()  所选元素里面的所有内容
    设置  $("div").html("<p></p>")   能识别标签                         $("div").text("<p></p>")  报错 不能识别

width()和height()
获取宽度  $("div").css(""width)  获取的是字符串
               $("div").width()  获取的是数字
    .innerWidth()  获取width+padding
    .outterWidth()  获取width+padding+border
    .outerWidth(true)  获取width+padding+border+margin

设置  $("div").css("width","200px")
         $("div").width(400)

获取窗口的宽度   $(window).width

根据窗口调整尺寸   $(window).resize(function(){})
        
获取卷曲的距离
    $(window).scroll(function(){
        $(this).scrollTop();
        $(this).scrollLeft();
                 })

    .scrollTop()  向上卷曲的距离
    .scrollLeft()  向左卷曲的距离

注册简单事件：一次只能注册一个
    $("p").click(function(){})

注册多个事件： bind()
    $("p").bind("click  mouseenter",function{})

不同事件处理不同的函数
    $("p").bind({
          click:function(){},
          mouseenter:function(){}
    })

新增一个p标签
    $("<p></p>").appendTo($("div"))

让新增的元素具有事件需要用委托事件  delegate(selector, type , callback)
    ① : 事件最终的执行者
    ② : 事件的类型
    ③ : 回调函数
$("div").delegate("p","click",function(){})
    委托事件不是自己执行, 而是把这个事件给被选中的子元素来执行
    好处:  动态创建的也能有事件
    注意 : 1.必须要是父子关系, 或者祖先与后背的关系
              2. 这个父亲必须是html代码静态存在的

on注册事件
    $("p").on("click",function(){})
    $("div").on("click","p",function(){})

解绑事件：off()
    $("p").off()  解除匹配元素的所有事件
    $("p").off("mouseenter")

触发事件：trigger(type)
    $("p:last").trigger("click")

阻止默认事件
    .preventDefault()
    .stopPropagation()
    return false  在jq中既能阻止冒泡事件，又能阻止默认的跳转事件

delay()  等待多少毫秒之后

each()方法：遍历jq对象集合，为每一个匹配的元素执行一个函数
$("li").each(function(index,element){})