jQuery入门知识总结

•  jQuery是一种轻量级的js方法库

• 入口小函数

       $(document).ready( function () {
            //脚本代码
       });

       //简写：
      $( function () {
         //脚本代码
     })

•  $(document).ready()与window.onload 区别

      1.执行时机
         window.onload
               必须等待网页全部加载完毕（包括图片等），然后再执行包裹代码
         $(document).ready()
               只需要等待网页中的DOM结构加载完毕，就能执行包裹的代码
     2.执行次数
            window.onload
                    只能执行一次，如果第二次，那么第一次的执行会被覆盖
            $(document).ready()
                    可以执行多次，第N次都不会被上一次覆盖

• dom对象与jQuery对象

        dom对象转换为jQuery对象：
               $(dom对象)
         jQuery对象转换为dom对象：
                jQuery对象[索引]
                jQuery对象.get(索引)

• 事件

    jQuery对象.click( function () {} )
           事件名不加on，括号里面写函数

• jquery选择器

    一.兄弟之间查找

1. $("E+F") ||  $("E").next()  紧邻E选择器后的那一个F兄弟选择器
2. $("E~F") ||  $("E").nextAll()  E选择器后的所有的F兄弟选择器
3. $("E").prev()  紧邻E选择器前的那个兄弟选择器
4. $("E").prevAll()  E选择器前的所有的兄弟选择器
5. $("E").siblings()  E选择器的其他的兄弟选择器

   二. 父子之间查找

1.  $("E >F") ||  $("E").children()   查找E选择器的直接子元素F
2.  $("E  F") ||  $("E").find("F")  查找E选择器里的所有子元素F
3.  $("E").parent()  查找选择器E的直接父元素
4.  $("E").parents()  查找选择器E的所有包含框父元素

  三.  过滤选择器

1.   $("E:first")  ||  $("E").first() 查找整个文档里的第一个E选择器
2.   $("E:last")  ||  $("E").last()查找整个文档里的最后一个E选择器
3.   $("E:eq(i)"）||  $("E").eq(i) 查找索引为i的E选择器
4.   $("E:gt(i)")  查找索引大于i的E选择器
5.   $("E:lt(i)")  查找索引小于i的E选择器
6.   $("E:odd")  查找索引为奇数的E选择器
7.   $("E:even")  查找索引为偶数的E选择器
8.   $("E:not(规则)")  查找不符合格则的E选择器

• jQuery操作css

    1.获取属性值
          jQuery对象.css("属性名“);
    2.单个属性设置
        jQuery对象.css("属性名","属性值");
    3.多个属性设置
        jQuery对象.css({
           "属性名":"属性值",
           "属性名":"属性值",.....
       })

• jquery操作类

    1.获取类名
        jquery对象.class("类名1   类名2   ....")

    2.增加类
        jquery对象.addClass("类名1   类名2   ....")
    3.删除类
        jquery对象.removeClass("类名1   类名2   ....")

• jquery操作内容

1.获取
        jquery对象.html()  
        当jquery对象是多个时，仅获取第一个jquery对象的内容
        jquery对象.text() 
       当jquery对象是多个时，可以获取所有jquery对象的内容
        jquery对象.val() 
       当jquery对象是多个时，仅获取第一个jquery对象的value值
2.设置
        jquery对象.html("内容")  
3.能识别标签
        jquery对象.text("内容") 
        jquery对象.val("内容") 

• jQuery效果动画

    1.显示与隐藏
          jQuery对象.show(参数1,参数2)  显示
          jQuery对象.hide(参数1,参数2)  隐藏
    2. 淡入淡出
          jQuery对象.fadeIn(参数1,参数2)  淡入
          jQuery对象.fadeOut(参数1,参数2)  淡出
          jQuery对象.fadeTo(opacity,参数1,参数2)  
    3.滑上滑下
          jQuery对象.slideUp(参数1,参数2)  滑上
          jQuery对象.slideDown(参数1,参数2)  滑下