jQuery

1歉甚、jQuery介紹

jQuery是一個(gè)快速、簡潔的JavaScript框架，是繼Prototype之后又一個(gè)優(yōu)秀的JavaScript代碼庫（或JavaScript框架）割笙。jQuery設(shè)計(jì)的宗旨是“write Less，Do More”眯亦，即倡導(dǎo)寫更少的代碼咳蔚，做更多的事情。它封裝JavaScript常用的功能代碼搔驼，提供一種簡便的JavaScript設(shè)計(jì)模式谈火，優(yōu)化HTML文檔操作、事件處理舌涨、動(dòng)畫設(shè)計(jì)和Ajax交互糯耍。

我們使用jQuery可以更好地完成以下操作：

（1）HTML文檔操作，對于DOM相關(guān)操作的優(yōu)化

（2）jQuery提供更加方便與豐富的事件處理

（3）jQuery提供簡單動(dòng)畫特效

（4）jQuery提供AJAX交互

我們知道囊嘉，要使用任何一個(gè)JS框架温技，都是需要導(dǎo)入相關(guān)的JS文件的。

關(guān)于其它常用的JS框架：

（1）AngularJS是一個(gè)MVC的JS框架扭粱，它提供模板和雙向數(shù)據(jù)綁定

（2）React學(xué)習(xí)成本比較高舵鳞，它提供了組件化和虛擬DOM技術(shù)

（3）Vue借鑒了二者的優(yōu)點(diǎn)，小巧靈活琢蛤，運(yùn)行效率高

jQuery的插件機(jī)制特別豐富蜓堕，在開發(fā)中可以選擇非常多的相關(guān)插件抛虏，簡化JS開發(fā)。例如套才，表單校驗(yàn)插件迂猴、樹形結(jié)構(gòu)插件……

二、jQuery核心函數(shù)

1背伴、jQuery(callback)

jQuery(callback)它是“$(document).ready()的簡寫”

$(document).ready(function(){});頁面加載完成后沸毁，指定的函數(shù)執(zhí)行

在jQuery的源代碼

2、jQuery(html,[ownerDocument])

jQuery(html代碼)它的作用是將一個(gè)DOM對象包裝成jQuery對象

問題：什么是jQuery對象傻寂？

我們的jQuery中定義的方法與屬性息尺，只有jQuery對象可以調(diào)用

這個(gè)核心函數(shù)的作用是將一個(gè)DOM對象包裝成了jQuery對象

而它的第一個(gè)參數(shù)是html代碼

它的第二個(gè)參數(shù)是可選的，用于設(shè)置DOM的相關(guān)屬性

3疾掰、jQuery([selector,[context]])

這個(gè)函數(shù)我們使用它的主要作用是用于在頁面上查找掷倔，根據(jù)CSS選擇器

參數(shù)1就是CSS選擇器，jQuery中提供了九種選擇器

參數(shù)2的context就是指定要查找的DOM集

4个绍、關(guān)于jQuery對象與DOM對象的轉(zhuǎn)換

對于DOM對象-->jQuery對象 ${dom}

對于jQuery對象-->dom對象 jQuery對象[0]或jquery.get(0)

三勒葱、jQuery選擇器

1、基本選擇器

????* #id 根據(jù)id屬性查找一個(gè)元素

????* element 根據(jù)元素的標(biāo)簽名查找元素

????* .class 根據(jù)元素的class屬性查找元素

????* * 匹配所有元素

????* selector1,selector2,selectorN 將每一個(gè)選擇器匹配到元素合并后一起返回

2）方法總結(jié)

html()方法

無參數(shù)代表獲取元素中的html代碼

有參數(shù)代表設(shè)置元素的html代碼

text()方法

無參數(shù)代表獲取元素中的文本信息

有參數(shù)代表設(shè)置元素的文本信息

each()方法

可以幫助我們遍歷元素巴柿，可以傳遞一個(gè)函數(shù)each(function(i))凛虽，這里的i就代表每一個(gè)元素的序號(hào)，在函數(shù)中可以通過this來獲取其DOM對象

index()方法

可以判斷元素的序號(hào)

2广恢、層級選擇器

層級選擇器是根據(jù)元素的關(guān)系來獲取凯旋，關(guān)系是指父子、兄弟關(guān)系等

* ancestor descendant

空格得到元素下的所有子元素（包含直接子元素與間接子元素）

* parent > child

大于號(hào) 只獲取直接的子元素

* prev + next

加號(hào) 只獲取緊隨在后的一個(gè)兄弟元素

* prev ~ siblings

波浪線獲取后邊的所有的兄弟元素

作者：卡拉什尼科夫_8ca2

鏈接：http://www.reibang.com/p/fc7692660747

來源：簡書

著作權(quán)歸作者所有钉迷。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)至非，非商業(yè)轉(zhuǎn)載請注明出處。

1糠聪、jQuery介紹

jQuery是一個(gè)快速荒椭、簡潔的JavaScript框架，是繼Prototype之后又一個(gè)優(yōu)秀的JavaScript代碼庫（或JavaScript框架）舰蟆。jQuery設(shè)計(jì)的宗旨是“write Less趣惠，Do More”，即倡導(dǎo)寫更少的代碼身害，做更多的事情味悄。它封裝JavaScript常用的功能代碼，提供一種簡便的JavaScript設(shè)計(jì)模式塌鸯，優(yōu)化HTML文檔操作侍瑟、事件處理、動(dòng)畫設(shè)計(jì)和Ajax交互丙猬。

我們使用jQuery可以更好地完成以下操作：

（1）HTML文檔操作涨颜，對于DOM相關(guān)操作的優(yōu)化

（2）jQuery提供更加方便與豐富的事件處理

（3）jQuery提供簡單動(dòng)畫特效

（4）jQuery提供AJAX交互

我們知道费韭，要使用任何一個(gè)JS框架，都是需要導(dǎo)入相關(guān)的JS文件的咐低。

關(guān)于其它常用的JS框架：

（1）AngularJS是一個(gè)MVC的JS框架，它提供模板和雙向數(shù)據(jù)綁定

（2）React學(xué)習(xí)成本比較高袜腥，它提供了組件化和虛擬DOM技術(shù)

（3）Vue借鑒了二者的優(yōu)點(diǎn)见擦，小巧靈活，運(yùn)行效率高

jQuery的插件機(jī)制特別豐富羹令，在開發(fā)中可以選擇非常多的相關(guān)插件鲤屡，簡化JS開發(fā)。例如福侈，表單校驗(yàn)插件酒来、樹形結(jié)構(gòu)插件……