?jQuery 不但提供了 CSS 的核心操作方法，比如.css()、.addClass()等。還封裝了一些特殊功能的 CSS 操作方法，我們分別來了解一下。

width()方法

$('div').width();                      //獲取元素的長度，返回的類型為 number

$('div').width(500);                      //設置元素長度，直接傳數值，默認加 px

$('div').width('500pt');                 //同上，設置了 pt 單位

$('div').width(function (index, value) {       //index 是索引，value 是原本值

return value - 500;                 //無須調整類型，直接計算

});

$('div').height();               //獲取元素的高度，返回的類型為 number

$('div').height(500);                  //設置元素高度，直接傳數值，默認加 px

$('div').height('500pt');              //同上，設置了 pt 單位

$('div').height(function (index, value) {   //index 是索引，value 是原本值

return value - 1;               //無須調整類型，直接計算

});

?

<div style=”width=200px; padding=100px; border=10px soild #000; margin=100px;”></div>

alert($('div').width());         //不包含

alert($('div').innerWidth());     //包含內邊距 padding

alert($('div').outerWidth());     //包含內邊距 padding+邊框 border

alert($('div').outerWidth(true)); //包含內邊距 padding+邊框 border+外邊距 margin

元素偏移方法

?

$('strong').offset().left;        //相對于body的margin左邊偏移,如果是定位的話，那么就是position的偏移

$('strong').offset().top;        //相對于body的margin頂部偏移

$('strong').position().left / top;   //相對于父元素(相對定位時)往左或上邊偏移的值

$(window).scrollTop();    //獲取當前滾動條的位置

$(window).scrollTop(300); //設置當前滾動條的位置

$("#btn1").click(function(){

   $("div").scrollTop(100);

});