JQuery教程自學(xué)筆記

JQuery 是開(kāi)源軟件，使用MIT許可證授權(quán)。[4] JQuery的語(yǔ)法設(shè)計(jì)使得許多操作變得容易，如操作文檔對(duì)象（document）、選擇DOM元素、創(chuàng)建動(dòng)畫(huà)效果、處理事件、以及開(kāi)發(fā)Ajax程序。JQuery 也提供了給開(kāi)發(fā)人員在其上創(chuàng)建插件的能力。這使開(kāi)發(fā)人員可以對(duì)底層交互與動(dòng)畫(huà)、高級(jí)效果和高級(jí)主題化的組件進(jìn)行抽象化。模塊化的方式使 JQuery 函數(shù)庫(kù)能夠創(chuàng)建功能強(qiáng)大的動(dòng)態(tài)網(wǎng)頁(yè)以及網(wǎng)絡(luò)應(yīng)用程序。

JQuery有下列特色:

•跨瀏覽器的DOM元素選擇
•DOM巡訪與更改：支援CSS 1-3與 基本的XPath，JQuery 1.2版以后默認(rèn)取消XPath支持，改為插件支持
•事件（Events）
•CSS操縱
•特效和動(dòng)畫(huà)（移動(dòng)顯示位置、淡入、淡出）
•Ajax
•延伸性（Extensibility）
•工具：例如瀏覽器版本和each函數(shù)。
•JavaScript插件
•輕量級(jí)

目錄

JQuery教程自學(xué)筆記 1

一、概述 4

二、JQuery技術(shù)綜述 5

2.1 JQuery基本語(yǔ)法 5

2.1.1 JQuery選擇器 6

2.2 JQuery事件響應(yīng) 8

2.2.1 常見(jiàn)的JQuery事件 9

2.2.2 淡入淡出效果 12

2.2.3 滑動(dòng)效果 15

2.2.4 動(dòng)畫(huà)效果 18

2.2.5 終止動(dòng)畫(huà) 20

2.2.6 回調(diào)函數(shù) 20

2.2.7 方法鏈 22

2.3 HTML操作 23

2.3.1 HTML 取值 23

2.3.2 HTML 賦值 25

2.3.3添加HTML元素 28

2.3.4設(shè)置或取得元素的CSS class 34

2.3.5讀寫(xiě)HTML元素的css 屬性 36

2.3.6 操作HTML元素的長(zhǎng)寬大小 37

三、JQuery UI 39

3.1 概述 39

3.2 JQuery UI 基本工作過(guò)程 41

3.2.1初始化 41

3.2.2 方法 42

3.2.3 通用方法 42

3.2.4 事件 43

3.2.5 共有事件 43

3.3 JQuery UI示例 44

3.3.1 Accordion組件（手風(fēng)琴似折疊） 44

3.3.2 JQuery UI Autocomplete（自動(dòng)完成） 56

3.3.3 JQuery UI Button（按鈕） 63

3.3.4 JQuery UI Datepicker (時(shí)間控件) 69

3.3.5 JQuery UI Dialog (對(duì)話框) 79

3.3.6 JQuery UI Menu （JQuery菜單） 88

3.3.7 JQuery UI Progressbar (進(jìn)度條) 92

3.3.8 JQuery UI Slider (滑動(dòng)條) 96

3.3.9 JQuery UI Spiner (微調(diào)框) 101

3.3.10 JQuery UI Tab (標(biāo)簽頁(yè)) 103

3.3.11 JQuery UI Tooltip (提示條) 111