jQuery

是一個封裝好的特定的集合(方法和函數(shù))。是一個庫，封裝了很多預(yù)先定義好的函數(shù)在里面。

概念

• jQuery是一個快速，簡潔的js庫。

• j是js，query是查詢，把js中的DOM操作作了封裝，我們可以快速的查詢使用里面的功能。

• jQuery封裝了js常用的功能代碼，優(yōu)化了DOM操作，事件處理，動畫設(shè)計(jì)和ajax交互。

• 學(xué)習(xí)jQuery的本質(zhì)就是學(xué)習(xí)調(diào)用這些函數(shù)。

• 使用jQuery可以提高開發(fā)者的開發(fā)效率。

優(yōu)點(diǎn)

• 輕量級，不影響頁面的加載速度

• 基本兼容了現(xiàn)在主流的瀏覽器

• 連式編程，隱式迭代

• 對事件樣式、動畫支持，大大簡化了DOM操作

• 支持插件擴(kuò)展開發(fā)

• 免費(fèi)，開源

下載

https://jquery.com 官網(wǎng)地址https://code.jquery.com 各個版本的下載

使用jQuery時，等著DOM結(jié)構(gòu)渲染完畢即可執(zhí)行內(nèi)部代碼，不必等到所有外部資源加載完畢，jQuery幫我們完成了封裝。相當(dāng)于原生js中的DOMContentLoaded，不同于原生js中的load事件是等頁面文檔、內(nèi)部的js文件、CSS文件，圖片加載完畢才執(zhí)行內(nèi)部代碼。

$是jQuery的別稱，可以使用jQuery代替，$是jQuery的頂級對象，相當(dāng)于原生js中的window，把元素利用$包裝成jQuery對象，就可以調(diào)用。

jQuery對象與DOM對象

• 用原生js獲取來的對象就是DOM對象

• jQuery獲取的元素就是jQuery對象

• jQuery對象的本質(zhì)是：利用$對DOM對象包裝后產(chǎn)生的對象(維數(shù)組形式存儲)

jQuery選擇器

基礎(chǔ)選擇器$("選擇器");層級選擇器$("ul>li"); 子代選擇器(獲取兒子)$("ul?li");??后代選擇器(獲取ul下的所有l(wèi)i元素)篩選選擇器:first $("li:first");???獲取第一個li元素$("li:last"); 獲取最后一個li元素????????:eq(index)?$("li:eq(2)"); 獲取索引號為2的li元素(從0開始)$("li:odd"); 獲取索引號為奇數(shù)的li元素$("li:even");?????獲取索引號為偶數(shù)的li元素

jQuery樣式操作

常用的有兩種

css()，多用于樣式少時操作，多了不方便

設(shè)置類樣式方法

設(shè)置類樣式方法比較和樣式多時操作，可以彌補(bǔ)css()的不足，原生js中className會覆蓋元素原先里面的類名，jQuery里面類操作只是對指定類進(jìn)行操作，不影響原先的類名。

常見的jQuery動畫效果

顯示隱藏：show()/hide()/toggle();劃入劃出：slideDown()slideUp()/slideToggle();淡入淡出：fadeIn()/fadeOut()/fadeToggle()/fadeTo();自定義動畫：animation();

注意：????動畫或者效果一旦觸發(fā)就會執(zhí)行，如果多次觸發(fā)，就造成多個動畫或者效果排隊(duì)執(zhí)行，jQuery提供一個方法，可以停止動畫排隊(duì)

stop();

每次使用動畫之前，先調(diào)用stop()，在調(diào)用動畫。

jQuery屬性操作

常用三種：prop()/attr()/data();語法操作1.獲取屬性操作prop("屬性");2.設(shè)置屬性語法prop("屬性"，"屬性值");元素自定義屬性值attr()1.獲取屬性語法attr("屬性");2.設(shè)置屬性語法attr("屬性","屬性值");數(shù)據(jù)緩存data()可以在指定的元素上存取數(shù)據(jù)，并不會修改DOM元素結(jié)構(gòu)，一旦頁面刷新，之前存放的數(shù)據(jù)都將被移除。1.附加數(shù)據(jù)語法data("name","value");2.獲取數(shù)據(jù)語法data("name");/常見文本屬性，常見三種：html()/text()/val();分別對應(yīng)js中的innerHTML，innerText和value屬性，主要針對元素的內(nèi)容還有表單的操作。1.普通元素內(nèi)容html("內(nèi)容")(識別標(biāo)簽)2.普通元素文本內(nèi)容text("文本內(nèi)容")(不識別標(biāo)簽)3.表單的值val("內(nèi)容")

總結(jié)

以上是生活随笔為你收集整理的jquery name选择器_jquery笔记的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。