1.單擊

$("#a").click(function(){
    $(this).hide();
})

2.雙擊

$("#a").dblclick();

3.當元素失去焦點

$("input").blur();

4.鍵盤上的鍵被按下

$("input").keypress();

5.鍵盤上的鍵被按下的過程

$("input").keydown();

6.鍵盤上的鍵被鬆開

$("input").keyup();

7.當滑鼠指標移到元素上

$("#a").mouseenter();

8.當滑鼠指標離開元素

$("#a").mouseleave();
 

9.滑鼠在該元素上按下

$("#a").mousedown();

10.在元素上鬆開滑鼠按鈕時

$("#a").mouseup();

11.提交表單

$("form").submit();

12.當 <input> 欄位改變時

$("input").change();

13.模擬游標懸停時間

① 當滑鼠移動到元素上，觸發第一個函式

② 當滑鼠移出元素，觸發第二個函式

$("input").hover(function() {
	/* Stuff to do when the mouse enters the element */
}, function() {
	/* Stuff to do when the mouse leaves the element */
});
 

14.當通過滑鼠點選選中元素或通過 tab 鍵定位到元素時，該元素就會獲得焦點

$("input").focus(function() {
	$(this).css("background-color","#eee");
});

15.向 <p> 元素新增 click 事件

$("p").on("click",function(){
	alert("成功添加了！")
});

16.使函式在文件載入後是可用的

$(document).ready();

17. each() 遍歷

$("li").each(function(index,element){
    ...
});	
 

18.map 函式

$.map(array, function(item, index) {
    return something;
});

19.隱藏和顯示

$("#a").show();
$("#a").hide('slow/400/fast', function() {
   	...
});
//切換 hide() 和 show() 方法
$("#a").toggle();

20.動畫 - - 淡入淡出     display:none;

$("#a").fadeIn(speed,callback);
$("#a").fadeOut('slow/400/fast', function() {
	...
});
$("#a").fadeToggle();

21動畫 - - 滑動      display:none;

$("#a").slideUp();
$("#a").slideDown('slow/400/fast', function() {
	...
});
$("#a").slideToggle();

22.獲得或設定內容

$("#a").text();  $("#a").text("我是文字內容");
$("#a").html();  $("#a").html("<p>我是html內容</p>")
$("#a").val();   $("#a").val("我是value內容")

23.獲得和設定屬性值

$("#a").attr("href");
$("#a").attr("href","https://www.baidu.com");
$("#a").attr({
	"href":"https://www.baidu.com",
	"class":"textClass"
});

24.新增新的 HTML 內容

① append  在被選元素的結尾插入

$("#a").append('<b>Append text</b>');

② prepend 在開頭插入

③ after 在被選元素之後

④ before 在被選元素之前

25.刪除元素

//刪除被選中元素及其子元素
$("#a").remove();
//刪除被選種元素的子元素
$("#a").empty();

26.操作 CSS 和設定 CSS 樣式

$("#a").addClass('yellow blue');
$("#a").removeClass('blue');
//切換 addClass 和 removeClass
$("#a").toggleClass('blue');

$("p").css("background-color":"yellow");

 27.返回每個 <div> 元素的所有子元素

$("div").children().css({
	property1: 'value1',
	property2: 'value2'
});

28.返回被選元素的後代元素

$("div").find("span");

29.過濾

① 返回被選元素的首個元素

$("div p").first().css();

② 返回備選元素的最後一個元素

$("div p").last().css();

③ 返回索引指定的元素

$("div p").eq(0).css();

30.返回帶有類名 " intro " 的所有 <p> 元素

$("p").filter(".intro");

not 與 filter 相反