目錄：

1. 簡介

2. 添加JQuery庫

3. 語法

4. 選擇器

5. 事件

簡介

JQuery是一個JavaScript函數庫，是目前最流行的 JS 框架。

JQuery官方的主旨是：write less, do more（以更少的代碼，實現更多的功能）

添加JQuery庫

• 網路添加

1. 百度靜態公共庫：http://cdn.code.baidu.com/

2. 新浪靜態公共庫：http://lib.sinaapp.com/

3. Bootstrap中文網開源項目免費CDN加速服務 http://www.bootcdn.cn/
   

• 本地

本地添加 JQuery

語法

基礎語法： $(selector).action()

• 美元符號定義 jQuery

• 選擇符（selector）"查詢"和"查找" HTML 元素

  Advertisements

• jQuery 的 action() 執行對元素的操作

選擇器

（一）基本

• #id：根據給定的ID匹配一個元素

• element：根據給定的元素名匹配所有元素

• .class：根據給定的類匹配元素

• * ：匹配所有元素

注意：要引用JQuery-1.12.4.js文件才有效果

1

2

3

（二）層級

• selector1,selector2,...,selectorN ：將每一個選擇器匹配到的元素合併后一起返回

• ancestor descendant：在給定的元素下匹配所有的後代元素

• parent >child：在給定的元素下匹配所有的子元素

• prev + next：匹配所有緊接在 prev 元素后的 next 元素

• prev ~ siblings ：匹配 prev元素之後的所有 siblings 元素

  Advertisements

事件

（一），單擊事件

click() 方法是當按鈕點擊事件被觸發時會調用一個函數。

代碼

單擊按鈕效果圖

（二），雙擊事件

當雙擊滑鼠右鍵時，會發生 dblclick() 事件。

以下事件方法參考「雙擊事件」，代碼格式可能一樣的。

下面與事件有關的方法

1. mouseenter()當滑鼠指針穿過元素時，會發生 mouseenter() 事件。

2. mouseleave()當滑鼠指針離開元素時，會發生 mouseleave() 事件

3. mousedown()當滑鼠指針移動到元素上方，並按下滑鼠按鍵時，會發生 mousedown() 事件

4. mouseup()當在元素上鬆開滑鼠按鈕時，會發生 mouseup 事件。

5. hover()方法用於模擬游標懸停事件。

6. focus()當元素獲得焦點時，發生 focus 事件。

7. blur()當元素失去焦點時，發生 blur 事件。