动画

• 基本

  • show([s,[e],[fn]])

  • hide([s,[e],[fn]])

隐藏一个元素
无参数时，隐藏元素
speed："slow","normal", "fast，表示从显示过渡到隐藏的速度，也可以直接写数字，1000代表1s。
function参数：在动画完成时执行的函数，每个元素执行一次。
easing参数：用来指定切换效果，默认是"swing"，可用参数"linear"

• toggle([s],[e],[fn])

综合应用，写一个点击显示/隐藏的小功能

  <div class="container">
    牛牛牛牛牛牛
  </div>
  <input type="button" value="点击">
......
  var flag = true;
  $("input").click(function(){
    if(flag){
      $(".container").hide(function(){
        console.log("隐藏了");
        flag = false;
      });
    } else {
      $(".container").show(function(){
        console.log("显示了");
        flag = true;
      });
    }
  });
//更简单的写法
  $("input").click(function(){
    $(".container").toggle();
  });

• 滑动

  • slideDown([s],[e],[fn])
    向下滑动
  • slideUp([s,[e],[fn]])
    向上滑动
  • slideToggle([s],[e],[fn])

• 淡入淡出

  • fadeIn([s],[e],[fn])
  • fadeOut([s],[e],[fn])
  • fadeTo([[s],o,[e],[fn]])
  • fadeToggle([s,[e],[fn]])

• 自定义

  • animate(params,[speed],[easing],[fn])^1.8*
    params:一组包含作为动画属性和终值的样式属性和及其值的集合
    speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如：1000)
    easing:要使用的擦除效果的名称(需要插件支持).默认jQuery提供"linear" 和 "swing".
    fn:在动画完成时执行的函数，每个元素执行一次。

  $(".container").animate({
    width:500,
    height:"300px",
    marginLeft: "20%"
  },2000);

• stop([c],[j])^1.7*

• delay(d,[q])

• finish([queue])^1.9+

• 设置

  • jQuery.fx.off

核心

• jQuery 核心函数

  • jQuery([sel,[context]])
  • jQuery(html,[ownerDoc])^1.8*
  • jQuery(callback)
  • jQuery.holdReady(hold)^3.2-
  • jQuery.readyException( error )^3.1+

• jQuery 对象访问

  • each(callback)
  • size()^1.8-
  • length
  • selector
  • context
  • get([index])
  • index([selector|element])

• 数据缓存

  • data([key],[value])
  • removeData([name|list])^1.7*
  • $.data(ele,[key],[val])^1.8-

• 队列控制

  • queue(e,[q])
  • dequeue([queueName])
  • clearQueue([queueName])

• 插件机制

小例子

一div里面现有内容"您好"，我们需要改为"您好，中国。"请问怎么做？

  function test(){
    var div = $(".container");
    div.text(div.text() + ",中国！")
  }
  test();

这样就可以了。这样是直接定义了一个函数，而jQuery的插件机制是在原有的jQuery里边添加一些属于jQuery的函数，让jQuery对象可以直接调用它。那我们如何修改上面的函数呢？

  $.fn.extend({
    add:function(value){
      //有点类似于给对象里面的原型添加一个方法，因为是jQuery调用函数
      this.text(this.text() + value)
    }
  });
  $(".container").add(",中国！");

这里的this指向jQuery对象，注意this指向标签只存在于事件中
改成这样就可以了。可以将这种函数封装在一个js文件里边，在需要用到的时候引入（注意引入必须写在jQuery的引入后边）

• jQuery.fn.extend(object)

• jQuery.extend(object)

• 多库共存

  • jQuery.noConflict([ex])