jQuery學習基礎知識小結
2019-11-21 00:05:23
供稿：網友
jQuery學習筆記：
jQuery學習
1、基本語法：
$(selector).action()
$:定義jQuery
selector:選擇符，查詢和查找HTML元素
action():對元素執行的操作
實例：
$(this).hide()------隱藏當前元素
$("p"),hide()-------隱藏所有的p元素
$("#ID").hide()-----隱藏id=ID的元素
$("p.Class")--------隱藏class=Class的P
$(document).ready(function(){-----});
這樣用為了防止文檔未加載就運行jQuery代碼。
2、選擇器通過屬性選擇元素
$("[href]") 選擇所有具有href屬性的元素
$("[href='AA']") 選擇屬性href=‘AA'的元素
$("[href!='AA']")選擇所有href！=‘AA'的元素
$("[href$='.jpg']")選取所有href值以.jpg結尾的元素
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) 被選元素的點擊事件
$(selector).dblclick(function) 被選元素的雙擊事件
$(selector).focus(function) 被選元素獲得焦點事件
$(selector).mouseover(function) 被選元素鼠標懸停事件
6、jQuery效果
$(selector).hide() 隱藏被選元素
$(selector).show() 顯示被選元素
$(selector).toggle() 切換（在隱藏與顯示之間）被選元素
$(selector).slideDown() 向下滑動（顯示）被選元素
$(selector).slideUp() 向上滑動（隱藏）被選元素
$(selector).slideToggle() 對被選元素切換向上滑動和向下滑動
$(selector).fadeIn() 淡入被選元素
$(selector).fadeOut() 淡出被選元素
$(selector).fadeTo() 把被選元素淡出為給定的不透明度
$(selector).animate() 對被選元素執行自定義動畫
參數："slow", "fast", "normal" 或毫秒
回調函數：callback
$("p").hide(1000,function(){
alert("The paragraph is now hidden");
});
7、jQuery的HTML操作
$(selector).html(content) 改變被選元素的（內部）HTML
$(selector).append(content) 向被選元素的（內部）HTML 追加內容
$(selector).prepend(content) 向被選元素的（內部）HTML “預置”（Prepend）內容
$(selector).after(content) 在被選元素之后添加 HTML
$(selector).before(content) 在被選元素之前添加 HTML
8、jQuery的CSS操作
$(selector).css(name,value) 為匹配元素設置樣式屬性的值
$(selector).css({properties}) 為匹配元素設置多個樣式屬性
$(selector).css(name) 獲得第一個匹配元素的樣式屬性值
$(selector).height(value) 設置匹配元素的高度
$(selector).width(value) 設置匹配元素的寬度
9、jQuery AJAX 請求
$(selector).load(url,data,callback) 把遠程數據加載到被選的元素中
$.ajax(options) 把遠程數據加載到 XMLHttpRequest 對象中
$.get(url,data,callback,type) 使用 HTTP GET 來加載遠程數據
$.post(url,data,callback,type) 使用 HTTP POST 來加載遠程數據
$.getJSON(url,data,callback) 使用 HTTP GET 來加載遠程 JSON 數據
$.getScript(url,callback) 加載并執行遠程的 JavaScript 文件
(selector) jQuery 元素選擇器語法
(url) 被加載的數據的 URL（地址）
(data) 發送到服務器的數據的鍵/值對象
(callback) 當數據被加載時，所執行的函數
(type) 被返回的數據的類型 (html,xml,json,jasonp,script,text)
(options) 完整 AJAX 請求的所有鍵/值對選項
