jquery复习笔记

 $('div').insertAfter($('p'))和$('p').after($('div'))作用相同都是把div放在p的后面，但不同的是操作对象不同，第一个操作对象是div，第二个是p，用.css('background','red')可现实操作对象为红色。

$('div').appendTo($('p'))和$('div').append($('p'))

第一个是把div放到p里，第二个是把p放在div里。

创建元素：

笨方法：

var oli=$('<li>');
oli.html('iiiiiii');
$('ul').append(oli);

简便方法：

$('ul').append('<li>hello</li>');

bind()绑定多个事件只需在事件中间加空格即可 如：

$('div').bind('mouseover mouseout',function(){      //在mouseover和mouseout中间加空格后当鼠标移入和移出都会执行函数
  alert('ooooo');
});

one();

和bind()一样，区别在于只执行一次，下次在出发事件就不会再执行。

unbind()能取消bind()和one()绑定的事件。

toggle()

该方法可传入多个函数作为参数，并且依次执行参数中的函数，且在所有参数执行结束后会循环执行，我刚开始用这个函数时总报错，当时用的是jquery2.1版，后来改为1.8版就能正常使用了。

渐入渐出（fadeOut(毫秒)  和 fadeIn(毫秒) ）：

$('button').toggle(function(){
  $('div').fadeOut();
},function(){
  $('div').fadeIn();
});

上展出，下展出（slideUp(毫秒)  和slideDown(毫秒)）：

$('button').toggle(function(){
  $('div').slideUp(1000);
},function(){
  $('div').slideDown(120);
});

动画animate （要配合stop()的使用）：

stop()清理正在执行的动画。不加stop()会使动画在事件出发时完整的执行后再执行下一事件触发函数。

$('div').hover(function(){
    $(this).animate({
      width:300,
      height:300
    });
},function(){
    $(this).animate({
      width:100,
      height:100
    });
});

添加stop()动画效果更加合理：

$('div').hover(function(){
    $(this).stop().animate({
      width:300,
      height:300
    });
},function(){
    $(this).stop().animate({
      width:100,
      height:100
    });
});

hover()函数里有两个function作为参数，第一个代表进入时执行，第二个移出时执行。