引用

Jquery基礎(chǔ)知識(shí)

概要

教程基本知識(shí)點(diǎn)筆記

內(nèi)容

1.jQuery - 獲得內(nèi)容和屬性
jQuery 擁有可操作 HTML 元素和屬性的強(qiáng)大方法
jQuery DOM 操作
jQuery 中非常重要的部分逃贝，就是操作 DOM 的能力氯材。
jQuery 提供一系列與 DOM 相關(guān)的方法，這使訪問和操作元素和屬性變得很容易
提示：DOM = Document Object Model（文檔對(duì)象模型）
DOM 定義訪問 HTML 和 XML 文檔的標(biāo)準(zhǔn)：
“W3C 文檔對(duì)象模型獨(dú)立于平臺(tái)和語言的界面欧芽，允許程序和腳本動(dòng)態(tài)訪問和更新文檔的內(nèi)容、結(jié)構(gòu)以及樣式葛圃∏樱”
獲得內(nèi)容 - text()、html() 以及 val()
三個(gè)簡(jiǎn)單實(shí)用的用于 DOM 操作的 jQuery 方法：
text() - 設(shè)置或返回所選元素的文本內(nèi)容
html() - 設(shè)置或返回所選元素的內(nèi)容（包括 HTML 標(biāo)記）
val() - 設(shè)置或返回表單字段的值
獲取屬性 - attr()
jQuery attr() 方法用于獲取屬性值

2.jQuery - 設(shè)置內(nèi)容和屬性
通過 text()库正、html() 以及 val() 方法來設(shè)置內(nèi)容
text() - 設(shè)置或返回所選元素的文本內(nèi)容
html() - 設(shè)置或返回所選元素的內(nèi)容（包括 HTML 標(biāo)記）
val() - 設(shè)置或返回表單字段的值
text()曲楚、html() 以及 val() 的回調(diào)函數(shù)
上面的三個(gè) jQuery 方法：text()、html() 以及 val()褥符，同樣擁有回調(diào)函數(shù)龙誊。
回調(diào)函數(shù)由兩個(gè)參數(shù)：被選元素列表中當(dāng)前元素的下標(biāo)，以及原始（舊的）值属瓣。
然后以函數(shù)新值返回您希望使用的字符串
jQuery attr() 方法也用于設(shè)置/改變屬性值载迄。
attr() 方法也允許您同時(shí)設(shè)置多個(gè)屬性讯柔。
jQuery 方法 attr()，也提供回調(diào)函數(shù)护昧。
回調(diào)函數(shù)由兩個(gè)參數(shù)：被選元素列表中當(dāng)前元素的下標(biāo)魂迄，以及原始（舊的）值。
然后以函數(shù)新值返回您希望使用的字符串惋耙。

3.jQuery - 添加元素
jQuery append() 方法在被選元素的結(jié)尾插入內(nèi)容捣炬。
jQuery prepend() 方法在被選元素的開頭插入內(nèi)容。
jQuery after() 方法在被選元素之后插入內(nèi)容绽榛。
jQuery before() 方法在被選元素之前插入內(nèi)容湿酸。

4.jQuery - 刪除元素
jQuery remove() 方法刪除被選元素及其子元素。
jQuery empty() 方法刪除被選元素的子元素灭美。
過濾被刪除的元素
jQuery remove() 方法也可接受一個(gè)參數(shù)推溃，允許您對(duì)被刪元素進(jìn)行過濾。
該參數(shù)可以是任何 jQuery 選擇器的語法届腐。

5.jQuery - 獲取并設(shè)置 CSS 類
jQuery 操作 CSS
addClass() - 向被選元素添加一個(gè)或多個(gè)類
removeClass() - 從被選元素刪除一個(gè)或多個(gè)類
toggleClass() - 對(duì)被選元素進(jìn)行添加/刪除類的切換操作

6.jQuery - css() 方法
css() 方法設(shè)置或返回被選元素的一個(gè)或多個(gè)樣式屬性铁坎。
返回 CSS 屬性
如需返回指定的 CSS 屬性的值，請(qǐng)使用如下語法：
css("propertyname");
設(shè)置 CSS 屬性
如需設(shè)置指定的 CSS 屬性犁苏，請(qǐng)使用如下語法：
css("propertyname","value");
下面的例子將為所有匹配元素設(shè)置 background-color 值
設(shè)置多個(gè) CSS 屬性
如需設(shè)置多個(gè) CSS 屬性硬萍，請(qǐng)使用如下語法：
css({"propertyname":"value","propertyname":"value",...});

7.jQuery - 尺寸
jQuery width() 和 height() 方法
width() 方法設(shè)置或返回元素的寬度（不包括內(nèi)邊距、邊框或外邊距）围详。
height() 方法設(shè)置或返回元素的高度（不包括內(nèi)邊距朴乖、邊框或外邊距）
jQuery innerWidth() 和 innerHeight() 方法
innerWidth() 方法返回元素的寬度（包括內(nèi)邊距）。
innerHeight() 方法返回元素的高度（包括內(nèi)邊距）
jQuery outerWidth() 和 outerHeight() 方法
outerWidth() 方法返回元素的寬度（包括內(nèi)邊距和邊框）助赞。
outerHeight() 方法返回元素的高度（包括內(nèi)邊距和邊框）