一、瞭解jQuery
1，是什麼（What）
- 一個JS函數庫
- 封裝簡化DOM操作（CRUD）/Ajax
2，爲什麼用它（Why）
- 強大的選擇器：方便快速查找DOM元素
- 隱式遍歷（迭代）：一次操作多個元素
- 讀寫合一：讀數據/寫數據用的是一個函數
- 鏈式調用：可以通過，不斷調用jQuery對象的方法
- 事件處理
- DOM操作（CUD）
- 樣式操作
- 動畫
- 瀏覽器兼容
3，如何使用（How）
引入jQuery庫
本地引入與CDN遠程引入
測試版與生產版（壓縮版）使用jQuery
使用jQuery函數：$/jQuery
使用jQuery對象：執行$()得到的
二、jQuery的兩把利器
1，jQuery函數：$/jQuery：
jQuery向外暴露的就是jQuery函數，可以直接使用
當成一般函數使用：$(param)
param是function: 相當於window.onload = function(文檔加載完成的監聽)
- param是選擇器字符串: 查找所有匹配的DOM元素, 返回包含所有DOM元素的jQuery對象
- param是DOM元素: 將DOM元素對象包裝爲jQuery對象返回 $(this)
- param是標籤字符串: 創建標籤DOM元素對象幷包裝爲jQuery對象返回
- 當成對象使用: $.xxx
- each(obj/arr, function(key, value){}) 遍歷
- trim(str) 去除首尾空格
2，jQuery對象
- 包含所有匹配的n個DOM元素的僞數組對象
- 執行$()返回的就是jQuery對象
基本行爲:
- length/size(): 得到dom元素的個數
- [index]: 得到指定下標對應的dom元素
- each(function(index, domEle){}): 遍歷所有dom元素
- index(): 得到當前dom元素在所有兄弟中的下標
三、屬性/文本操作
- 操作標籤的屬性, 標籤體文本
- attr(name) / attr(name, value): 讀寫非布爾值的標籤屬性
- prop(name) / prop(name, value): 讀寫布爾值的標籤屬性
- removeAttr(name)/removeProp(name): 刪除屬性
- addClass(classValue): 添加class
- removeClass(classValue): 移除指定class
- val() / val(value): 讀寫標籤的value
- html() / html(htmlString): 讀寫標籤體文本