WEB開發(fā)-帶你JQuery入門學(xué)習(xí)

在學(xué)習(xí)了HTML，CSS，javaScript后，為了讓腳本開發(fā)更簡單，更高效，接著就來學(xué)習(xí)一下JQuery庫。jQuery 是一個輕量級的“寫的少，做的多”的 javaScript 函數(shù)庫。它是目前最流行的 JS 代碼庫，而且提供了大量的擴展，并且兼容所有的主流瀏覽器。

JQuery 能做什么

1.HTML 元素選取和操作

2.HTML 事件函數(shù)

3.CSS 操作

4.JS 特效和動畫

5.AJAX

6.擴展工具庫等等

JQuery 使用

1.官網(wǎng)下載 JQuery.js，在網(wǎng)頁中

JQuery語法

使用JQuery可以選取HTML元素，并對元素進行某些操作。

語法：$(selector).action()? ? ? ? $：定義的JQuery；selector：查找和查詢HTML的元素；action：執(zhí)行的操作。

文檔就緒事件

主要指在DOM加載完成之后才能進行DOM操作。

// 第一種寫法 $(document).ready(function(){ // jQuery 代碼塊 }); // 第二種簡寫 $(function(){ // jQuery 代碼塊 });

JQuery主要操作

1.選擇器

選擇器基于元素的 id、類、類型、屬性、屬性值等"查找"（或選擇）HTML 元素。

如：元素（$("p")）， id名稱（$("#id")），類名稱（$(".class")），當(dāng)前元素（$(this)）

2.事件

事件是指當(dāng) HTML 中發(fā)生某些事件時所調(diào)用的方法。

如：點擊（click），提交（submit），獲得焦點（focus），失去焦點（blur），改變事件（change），滾動（scroll），鼠標(biāo)懸停（hover）

$("p").click(function(){ // 點擊操作 }); $("p").hover( function(){ // 光標(biāo)懸停操作 }, function(){ // 光標(biāo)離開操作 } ); $("dropdown").change(function(){ // 下拉框內(nèi)容改變操作 });

3.元素特效

顯示（show()），隱藏（hide()），向下滑動（slideDown()），向上滑動（slideUp()），動畫（animate()），停止（stop()）

$("p").show(); $("p").toggle(); $("p").hide("slow",function(){ // 隱藏后的操作 });

4.遍歷

根據(jù)相對于其他元素的關(guān)系來"查找"（或選取）HTML 元素。以某項選擇開始，并沿著這個選擇移動，直到抵達所要找的元素為止。

祖先-向上遍歷（parent()，parents()，parentsUntil()）

后代-向下遍歷（children()，find()）

同胞-水平遍歷（siblings()，next()，nextAll()，prev()，prevAll()）

過濾-縮小檢索范圍（first()，last()，eq()，filter()）

5.AJAX

AJAX 是與服務(wù)器交換數(shù)據(jù)的技術(shù)，它在不重載全部頁面的情況下，實現(xiàn)了對部分網(wǎng)頁的更新。

load()：從服務(wù)器加載數(shù)據(jù)，并把返回的數(shù)據(jù)放入被選元素中。

$(selector).load(URL,data,callback); // URL：必需，參數(shù)規(guī)定您希望加載的 URL。 // data：可選，參數(shù)規(guī)定與請求一同發(fā)送的查詢字符串鍵/值對集合。 // callback：可選，參數(shù)是 load() 方法完成后所執(zhí)行的函數(shù)名稱。

get()：從指定的資源請求數(shù)據(jù)，可能返回緩存數(shù)據(jù)。

$.get(URL,callback); // URL：必需，參數(shù)規(guī)定您希望請求的 URL。 // callback：可選，參數(shù)是請求成功后所執(zhí)行的函數(shù)名。

post()：向指定的資源提交要處理的數(shù)據(jù)，不會緩存數(shù)據(jù)。

$.post(URL,data,callback); // URL：必需，參數(shù)規(guī)定您希望請求的 URL。 // data：可選，參數(shù)規(guī)定連同請求發(fā)送的數(shù)據(jù)。 // callback：可選，參數(shù)是請求成功后所執(zhí)行的函數(shù)名。

jQuery web前端

版權(quán)聲明：本文內(nèi)容由網(wǎng)絡(luò)用戶投稿，版權(quán)歸原作者所有，本站不擁有其著作權(quán)，亦不承擔(dān)相應(yīng)法律責(zé)任。如果您發(fā)現(xiàn)本站中有涉嫌抄襲或描述失實的內(nèi)容，請聯(lián)系我們jiasou666@gmail.com 處理，核實后本網(wǎng)站將在24小時內(nèi)刪除侵權(quán)內(nèi)容。

版權(quán)聲明：本文內(nèi)容由網(wǎng)絡(luò)用戶投稿，版權(quán)歸原作者所有，本站不擁有其著作權(quán)，亦不承擔(dān)相應(yīng)法律責(zé)任。如果您發(fā)現(xiàn)本站中有涉嫌抄襲或描述失實的內(nèi)容，請聯(lián)系我們jiasou666@gmail.com 處理，核實后本網(wǎng)站將在24小時內(nèi)刪除侵權(quán)內(nèi)容。