jQuery學(xué)習(xí)筆記: jQuery學(xué)習(xí) 1、基本語(yǔ)法: $(selector).action() $:定義jQuery selector:選擇符,,查詢和查找HTML元素 action():對(duì)元素執(zhí)行的操作 實(shí)例: $(this).hide()------隱藏當(dāng)前元素 $("p"),hide()-------隱藏所有的p元素 $("#ID").hide()-----隱藏id=ID的元素 $("p.Class")--------隱藏class=Class的P $(document).ready(function(){-----}); 這樣用為了防止文檔未加載就運(yùn)行jQuery代碼,。 2、選擇器通過屬性選擇元素 $("[href]") 選擇所有具有href屬性的元素 $("[href='AA']") 選擇屬性href=‘AA'的元素 $("[href!='AA']")選擇所有href,!=‘AA'的元素 $("[href$='.jpg']")選取所有href值以.jpg結(jié)尾的元素 3,、選擇器選擇Css屬性 $("p").css("background-color","red"); 修改所有的p元素的背景顏色為紅色 $("div#ID .Class") id=ID的div元素中所有class=Class的元素 4、名稱沖突 var jQMy = jQuery.noConflict() yong jQMy代替$ 5,、常用事件 $(document).ready(function) 文檔的就緒事件 $(selector).click(function) 被選元素的點(diǎn)擊事件 $(selector).dblclick(function) 被選元素的雙擊事件 $(selector).focus(function) 被選元素獲得焦點(diǎn)事件 $(selector).mouseover(function) 被選元素鼠標(biāo)懸停事件 6,、jQuery效果 $(selector).hide() 隱藏被選元素 $(selector).show() 顯示被選元素 $(selector).toggle() 切換(在隱藏與顯示之間)被選元素 $(selector).slideDown() 向下滑動(dòng)(顯示)被選元素 $(selector).slideUp() 向上滑動(dòng)(隱藏)被選元素 $(selector).slideToggle() 對(duì)被選元素切換向上滑動(dòng)和向下滑動(dòng) $(selector).fadeIn() 淡入被選元素 $(selector).fadeOut() 淡出被選元素 $(selector).fadeTo() 把被選元素淡出為給定的不透明度 $(selector).animate() 對(duì)被選元素執(zhí)行自定義動(dòng)畫 參數(shù):"slow", "fast", "normal" 或毫秒 回調(diào)函數(shù):callback $("p").hide(1000,function(){ alert("The paragraph is now hidden"); }); 7、jQuery的HTML操作 $(selector).html(content) 改變被選元素的(內(nèi)部)HTML $(selector).append(content) 向被選元素的(內(nèi)部)HTML 追加內(nèi)容 $(selector).prepend(content) 向被選元素的(內(nèi)部)HTML “預(yù)置”(Prepend)內(nèi)容 $(selector).after(content) 在被選元素之后添加 HTML $(selector).before(content) 在被選元素之前添加 HTML 8,、jQuery的CSS操作 $(selector).css(name,value) 為匹配元素設(shè)置樣式屬性的值 $(selector).css({properties}) 為匹配元素設(shè)置多個(gè)樣式屬性 $(selector).css(name) 獲得第一個(gè)匹配元素的樣式屬性值 $(selector).height(value) 設(shè)置匹配元素的高度 $(selector).width(value) 設(shè)置匹配元素的寬度 9,、jQuery AJAX 請(qǐng)求 $(selector).load(url,data,callback) 把遠(yuǎn)程數(shù)據(jù)加載到被選的元素中 $.ajax(options) 把遠(yuǎn)程數(shù)據(jù)加載到 XMLHttpRequest 對(duì)象中 $.get(url,data,callback,type) 使用 HTTP GET 來(lái)加載遠(yuǎn)程數(shù)據(jù) $.post(url,data,callback,type) 使用 HTTP POST 來(lái)加載遠(yuǎn)程數(shù)據(jù) $.getJSON(url,data,callback) 使用 HTTP GET 來(lái)加載遠(yuǎn)程 JSON 數(shù)據(jù) $.getScript(url,callback) 加載并執(zhí)行遠(yuǎn)程的 JavaScript 文件 (selector) jQuery 元素選擇器語(yǔ)法 (url) 被加載的數(shù)據(jù)的 URL(地址) (data) 發(fā)送到服務(wù)器的數(shù)據(jù)的鍵/值對(duì)象 (callback) 當(dāng)數(shù)據(jù)被加載時(shí),所執(zhí)行的函數(shù) (type) 被返回的數(shù)據(jù)的類型 (html,xml,json,jasonp,script,text) (options) 完整 AJAX 請(qǐng)求的所有鍵/值對(duì)選項(xiàng) |
|
來(lái)自: 菜園子圖書館 > 《jQuery學(xué)習(xí)》