鏈式調用

jquery對象的方法會在執行完后返回這個jquery對象，所有jquery對象的方法可以連起來寫：

$('#div1') // id為div1的元素
.children('ul') //該元素下面的ul子元素
.slideDown('fast') //高度從零變到實際高度來顯示ul元素
.parent() //跳到ul的父元素，也就是id為div1的元素
.siblings() //跳到div1元素平級的所有兄弟元素
.children('ul') //這些兄弟元素中的ul子元素
.slideUp('fast'); //高度實際高度變換到零來隱藏ul元素

動畫

通過animate方法可以設置元素某屬性值上的動畫，可以設置一個或多個屬性值，動畫執行完成后會執行一個函數。

$('#div1').animate({
width:300,
height:300
},1000,swing,function(){
alert('done!');
});

• 參數可以寫成數字表達式：

$('#div1').animate({
width:'+=100',
height:300
},1000,swing,function(){
alert('done!');
});

• 尺寸相關、滾動事件

獲取和設置元素的尺寸

width()、height() 獲取元素width和height
innerWidth()、innerHeight() 包括padding的width和height
outerWidth()、outerHeight() 包括padding和border的width和height
outerWidth(true)、outerHeight(true) 包括padding和border以及margin的width和height

獲取元素相對頁面的絕對位置

offse()

獲取可視區高度

$(window).height();

獲取頁面高度

$(document).height();

獲取頁面滾動距離

(documeet) scrollTop (image-626a65-1544595969622)]

(document).scrollLeft();

頁面滾動事件

$(window).scroll(function(){
......
})