$()下的常用方法

addClass()：添加样式

removeClass()：删除样式

$('div').addClass('box2 box4');$('div').removeClass('box2 box4');

width():获取元素的宽

与css('width')的区别：width()获取时没有带单位。

alert($('div').width());alert($('div').css('width'));

innerWidth()、outWidth()

alert($('div').innerWidth());//width+paddingalert($('div').outWidth());//width+padding+borderalert($('div').outWidth(true));//width+padding+border+margin

jQuery方法之DOM操作

$(function(){    $('span').insertBefore($('div'));//找到span，剪切放到div前面     $('div').insertAfter($('span'));//找到div，剪切放到span后面    $('div').appendTo($('span'));//appendTo=appendChlid,把div放在span里面的最后一个位置     $('div').prependTo($('span'));//把div放在span里面的第一个位置，把一个节点添加到指定节点的最开始位置})

$(function(){    $('div').before($('span'));//span前面必须是div     $('div').after($('span'));//span后面必须是div    $('div').appendTo($('span'));//appendTo=appendChlid,把div放在span里面的最后一个位置     $('div').prependTo($('span'));//把div放在span里面的第一个位置，把一个节点添加到指定节点的最开始位置})

before与insertBefore的区别：后续操作变了

$('div').before($('span')).css('background','red');//变红的是div $('span').insertBefore($('div')).css('background','red');//变红的是span$('div').remove();//删除div

事件的写法

$(function(){    $('div').click(function(){        alert(123);    });})

或

$(function(){    $('div').on('click mouseover',function(){        alert(123);//可用于自定义事件,还可以同时写多个事件    })})

鼠标点击弹123，鼠标移入弹456,Json写法:

$(function(){    $('div').on({        'click':function()         {            alert(123);         }        },{        'mouseover':function(){            alert(456);        }        })})

取消事件，还可以针对不同的取消事件：

$(function(){    $('div').on('click mouseover',function(){        alert(123);    $('div').off('mouseover');//取消鼠标移入事件    })})$(function(){    $('div').on('click mouseover',function(){        alert(123);    $('div').off();//取消所有事件    })})

获取滚动距离

$(function(){    $(document).click(function(){        alert($(window).scrollTop());     })})

创建一个div

$(function(){    document.createElement('div');//原生的写法    var oDiv=$('
    
     div
    
');    $('body').append(oDiv);})