jQuery 參考手冊 - 選擇器：https://www.w3school.com.cn/jquery/jquery_ref_selectors.asp
選擇器：https://www.runoob.com/jquery/jquery-ref-selectors.html
一、核心
$ 是 jquery 類的一個别名，$() 構造一個 jquery 對象，jQuery 的核心功能都是通過這個函數實作的。 jQuery 中的一切都基于這個函數，或者說都是在以某種方式使用這個函數。
1、 $(表達式)
根據這個表達式來查找所有比對的元素。
$("div>p"); 查找所有p元素，且這些p元素都是div的子元素.
$("input:radio", document.forms[0]); 查找文檔第一個表單中，所有的單選按鈕。
$("div",xml.responseXML); 在一個由ajax傳回的xml文檔中，查找所有的div元素。
注意：jQuery() 的第二個參數是 DOM 節點内容。如果沒有指定那麼 context 指向目前的文檔 (document) 。
2、$(html标記字元串)
根據提供的 html 字元串，建立 jquery 對象包裝的dom元素。
$("<div><p>Hello</p></div>").appendTo("body");
$("<input type='text'>"); 建立一個 <input> 元素必須同時設定 type 屬性
3、$(dom元素)
将一個或多個dom元素轉換為 jquery 對象。
$(document.body).css( "background", "black" ); 設定頁面背景色
$(document).ready(function(){})==$(function(){})；在頁面加載完成後自動執行的代碼。
二、jquery 對象通路
傳回的是 jquery 對象，隻能使用 jquery 方法，get 傳回的是 dom 元素對象，隻能使用 dom 方法.
- 1、$(dom元素).each(function(){}); 以每一個比對的元素作為上下文來執行一個函數
- 2、$(dom元素).size()==$(dom元素).length;對象中元素的個數。示例：<img src="test1.jpg"/> <img src="test2.jpg"/>，jquery代碼：$("img").size();
- 3、context：傳給 jQuery() 的原始的 DOM 節點内容，即 jQuery() 的第二個參數。如果沒有指定，那麼 context 指向目前的文檔 (document) 。
- 4、$(dom元素).get()：取得所有比對的dom元素的集合。如果你想要直接操作 DOM 對象而不是 jQuery 對象，這個函數非常有用。
- 5、$(dom元素).get(index)：取得其中一個比對的元素.
- 6、$(dom元素).index(): 搜尋與參數表示的對象比對的元素，并傳回相應元素的索引值。
三、插件機制
1、jQuery.fn.extend(object);
擴充 jQuery 元素集來提供新的方法,針對某一個dom元素。
jQuery.fn.extend({
check: function() { return this.each(function() { this.checked = true; });},
uncheck: function() { return this.each(function() { this.checked = false; });}
});
調用：
$("input[type=checkbox]").check();
$("input[type=radio]").uncheck();
2、$.extend(object);
用來在 jQuery 命名空間上增加新函數,針對所有dom元素。
$.extend({
min:function(a,b){return a<b?a:b;},
max:function(a,b){return a>b?a;b;}
});
調用：$.max(10,20);
四、選擇器
基本 選擇器：
$("#id") //ID選擇器, 根據給定的ID比對一個元素
$("div") //元素選擇器, 選擇所有div
$(".classname") //類選擇器, 根據給定的類比對元素。
$("*") //比對所有元素。
$(".classname,.classname1,#id1") //組合選擇器
層次 選擇器：
$("ancestor descendant"):在給定的祖先元素下比對所有的後代元素
$("parent > child"):在給定的父元素下比對所有的子元素
$("prev + next"):比對所有緊接在 prev 元素後的 next 元素
$("prev ~ siblings"):比對 prev 元素之後的所有 siblings(同級) 元素
$("#id>.classname ") // 子元素選擇器
$("#id .classname ") // 後代元素選擇器
$("#id + .classname ") // 緊鄰下一個元素選擇器
$("#id ~ .classname ") // 兄弟元素選擇器
過濾 選擇器(重點)：
$("li:first") // 第一個li
$("li:last") // 最後一個li
$("li:even") // 挑選下标為偶數的li
$("li:odd") // 挑選下标為奇數的li
$("li:eq(4)") // 下标等于 4 的li(第五個 li 元素)
$("li:gt(2)") // 下标大于 2 的li
$("li:lt(2)") // 下标小于 2 的li
$("li:not(#runoob)") // 挑選除 id="runoob" 以外的所有li
内容 過濾 選擇器：
$("div:contains('Runob')") // 包含 Runob文本的元素
$("td:empty") // 不包含子元素或者文本的空元素
$("div:has(p)") // 比對所有包含 p 元素的 div 元素
$("td:parent") //含有子元素或者文本的元素
可見性 過濾 選擇器：
$("tr:visible") 查找所有可見的 tr 元素
$("tr:hidden") 比對所有的不可見元素，input 元素的 type 屬性為 "hidden" 的話也會被比對到
屬性 過濾 選擇器：
$("div[id]") 查找所有含有 id 屬性的 div 元素
$("input[name='newsletter']") 查找所有 name 屬性是 newsletter 的 input 元素
$("input[name!='newsletter']") 查找所有 name 屬性不是 newsletter 的 input 元素
$("input[name^='news']") 查找所有 name 以 'news' 開始的 input 元素
$("input[name$='letter']") 查找所有 name 以 'letter' 結尾的 input 元素
$("input[name*='man']") 查找所有 name 包含 'man' 的 input 元素
$("input[id][name$='man']") 找到所有含有 id 屬性，并且它的 name 屬性是以 man 結尾的
$("div[id]") // 所有含有 id 屬性的 div 元素
$("div[id='123']") // id屬性值為123的div 元素
$("div[id!='123']") // id屬性值不等于123的div 元素
$("div[id^='qq']") // id屬性值以qq開頭的div 元素
$("div[id$='zz']") // id屬性值以zz結尾的div 元素
$("div[id*='bb']") // id屬性值包含bb的div 元素
$("input[id][name$='man']") //多屬性選過濾，同時滿足兩個屬性的條件的元素
狀态 過濾 選擇器：
$("input:enabled") // 比對可用的 input
$("input:disabled") // 比對不可用的 input
$("input:checked") // 比對選中的 input
$("option:selected") // 比對選中的 option
子元素：
比對其父元素下的第N個子或奇偶元素
:nth-child(even) 偶數元素
:nth-child(odd) 奇數元素
:nth-child(3n)
:nth-child(2)
:nth-child(3n+1)
:nth-child(3n+2)
$("ul li:first-child") 在每個 ul 中查找第一個 li
$("ul li:last-child") 在每個 ul 中查找最後一個 li
$("ul li:only-child") 在 ul 中查找是唯一子元素的 li
表單 選擇器：
$(":input") 查找所有的input元素
$("text") 比對所有的單行文本框, 等價于 $("[type=text]")
推薦使用 $("input:text") 效率更高，下同
$(":password") 比對所有密碼框
$("radio") 比對所有單選按鈕
$("checkbox") 比對所有複選框
$("submit") 比對所有送出按鈕
$("image") 比對所有圖像域
$("button") 比對所有按鈕
$("file") 比對所有檔案域
$("hidden") 比對所有不可見元素，或者type為hidden的元素
表單 對象 屬性
$("input:checked") 比對所有選中的被選中元素(複選框、單選框等，不包括select中的option)
$("input:enabled") 比對所有可用元素
$("input:disabled") 比對所有不可用元素
$("select option:selected") 比對所有選中的option元素
jQuery 常用的元素查找方法總結
$("#myELement") 選擇id值等于myElement的元素
$("div") 選擇所有的div标簽元素，傳回div元素數組
$(".myClass") 選擇使用myClass類的css的所有元素
$("*") 選擇文檔中的所有的元素，
可以運用多種的選擇方式進行聯合選擇：
例如 $("#myELement,div,.myclass")
$("A B") 查找A元素下面的所有子節點，包括非直接子節點
$("A>B") 查找A元素下面的直接子節點
$("A+B") 查找A元素後面的兄弟節點，包括非直接子節點
$("A~B") 查找A元素後面的兄弟節點，不包括非直接子節點
層疊選擇器：
$("form input") 選擇所有的form元素中的input元素
$("#main > *") 選擇id值為main的所有的子元素
$("label + input") 選擇所有的label元素的下一個input元素節點，
$("#prev ~ div") 同胞選擇器，該選擇器傳回的為id為prev的标簽元素的所有的屬于同一個父元素的div标簽
基本過濾選擇器：
$("tr:first") 選擇所有tr元素的第一個
$("tr:last") 選擇所有tr元素的最後一個
$("input:not(:checked) + span") 過濾掉：checked 的選擇器的所有的input元素
$("tr:even") 選擇所有的tr元素的第0，2，4... ...個元素（注意：數組序号是從0開始）
$("tr:odd") 選擇所有的tr元素的第1，3，5... ...個元素
$("td:eq(2)") 選擇所有的td元素中序号為2的那個td元素
$("td:gt(4)") 選擇td元素中序号大于4的所有td元素
$("td:ll(4)") 選擇td元素中序号小于4的所有的td元素
$(":header")
$("div:animated")
内容過濾選擇器：
$("div:contains('John')") 選擇所有div中含有John文本的元素
$("td:empty") 選擇所有的為空（也不包括文本節點）的td元素的數組
$("div:has(p)") 選擇所有含有p标簽的div元素
$("td:parent") 選擇所有的以td為父節點的元素數組
可視化過濾選擇器：
$("div:hidden") 選擇所有的被hidden的div元素
$("div:visible") 選擇所有的可視化的div元素
屬性過濾選擇器：
$("div[id]") 選擇所有含有id屬性的div元素
$("input[name='newsletter']") 選擇所有的name屬性等于'newsletter'的input元素
$("input[name!='newsletter']") 選擇所有的name屬性不等于'newsletter'的input元素
$("input[name^='news']") 選擇所有的name屬性以'news'開頭的input元素
$("input[name$='news']") 選擇所有的name屬性以'news'結尾的input元素
$("input[name*='man']") 選擇所有的name屬性包含'news'的input元素
$("input[id][name$='man']") 可以使用多個屬性進行聯合選擇
該選擇器是得到所有的含有id屬性并且那麼屬性以man結尾的元素
子元素過濾選擇器：
$("ul li:nth-child(2)"),$("ul li:nth-child(odd)"),$("ul li:nth-child(3n + 1)")
$("div span:first-child") 傳回所有的div元素的第一個子節點的數組
$("div span:last-child") 傳回所有的div元素的最後一個節點的數組
$("div button:only-child") 傳回所有的div中隻有唯一一個子節點的所有子節點的數組
表單元素選擇器：
$(":input") 選擇所有的表單輸入元素，包括input, textarea, select 和 button
$(":text") 選擇所有的text input元素
$(":password") 選擇所有的password input元素
$(":radio") 選擇所有的radio input元素
$(":checkbox") 選擇所有的checkbox input元素
$(":submit") 選擇所有的submit input元素
$(":image") 選擇所有的image input元素
$(":reset") 選擇所有的reset input元素
$(":button") 選擇所有的button input元素
$(":file") 選擇所有的file input元素
$(":hidden") 選擇所有類型為hidden的input元素或表單的隐藏域
表單元素過濾選擇器：
$(":enabled") 選擇所有的可操作的表單元素
$(":disabled") 選擇所有的不可操作的表單元素
$(":checked") 選擇所有的被checked的表單元素
$("select option:selected") 選擇所有的select 的子元素中被selected的元素
選取一個name 為 S_03_22 的 input text框的上一個td的text值
$("input[@name =S_03_22]").parent().prev().text()
名字以 S_ 開始，并且不是以 _R 結尾的
$("input[@name ^='S_']").not("[@name $='_R']")
一個名為 radio_01 的 radio 所選的值
$("input[@name =radio_01][@checked]").val(); jQuery 快速查詢大全
常用的選擇器：
#id 根據給定的id比對
.classname 根據給定的類名比對
name 根據給定的元素名比對
* 比對所有的元素
select1,select2 将每一個比對到的元素合并後一起傳回
s1 s2 選取s1元素裡所有的s2元素 子孫
parent>child 擷取parent元素下的child元素 兒子
prev+next 選取緊接在prev元素後的next元素
prev~siblings 選取prev之後所有的siblings元素
常用的過濾選擇器：
:first 選取第一個元素
:last 選取最後一個元素
:not(selector) 去除所有與給定選擇器比對的元素
:even 選取索引值為偶數的元素，從0開始
:odd 選取索引值為奇數的元素
:eq(index) 比對一個給定索引值的元素
:gt(index) 比對大于給定索引值的元素
:lt(index) 比對小于給定索引值的元素
:header 選擇h1，h2....一類的标簽
:animated 比對正執行動畫效果的元素
常用的内容過濾選擇器：
:contains(text) 比對包含給定文本的元素
:empty 比對所有不包含子元素或者文本的空元素
:has(selector) 比對含有選擇器所比對元素的元素
:parent 選取含有子元素或文本的元素
:hidden 選取所有不可見元素
:visible 選取所有可見元素
常用的屬性過濾選擇器(跟在元素後面用，過濾器)：
[attr] 選取擁有此屬性的元素
[arrt=val] 屬性等于val
[arrt!=val] 屬性不等于val
[arrt^=val] 屬性以val開始的
[arrt$=val] 屬性以val結束的
[arrt*=val] 屬性包含val的
[arrt~=val] 屬性包含val且以空格隔開
[attr1][attr2]... 多個屬性選擇器合并成一個複合屬性選擇器
常用的表單選擇器(直接使用)：
:input 選取所有<input>、<textarea>、<select>、<button>元素
:text 選取所有的單行文本框
:password 選取所有的密碼框
:radio 選取所有的單選按鈕
:checkbox 選取所有的複選框
:submit 選取所有的送出按鈕
:image 選取所有的圖像按鈕
:reset 選取所有的重置按鈕
:button 選取所有的按鈕
:file 選取所有的上傳域
常用的表單對象屬性過濾選擇器：
:disabled 選取所有不可用元素
:enabled 選取所有可用元素
:checked 選取所有被選中的元素
:selected 選取所有被選中的選項元素
管理選擇器得到的結果：
size() 擷取選擇器中元素的個數
index(element) 查找元素在集合中的位置
add() 給集合添加元素
not() 去除元素集合中的某個元素
filter() 篩選去除元素集合中的元素獲得新集合
find() 通過查詢擷取新的元素集合
each() 對選擇器中的元素進行周遊
end() 回到操作對象的上一個對象
andself() 将前面的對象進行組合後共同處理
建立元素節點：
用 $() 來建立節點
var $node = $('<p title="hello">hello</p>');
插入元素節點：
append() 向每個比對的元素内部追加子元素内容 appendTo()
prepend() 向每個比對的元素内容前置子元素内容 prependTo()
after() 在每個比對元素後插入同輩内容 insertAfter()
before() 在每個比對元素之前插入内容 insertbefore()
删除元素節點：
remove()
var $remove_li = $("ul li:eq(1)").remove( ); 删除ul第2個li，傳回被删除的li對象
$("ul li").remove("li[ title='a']"); 通過參數來選擇性删除
detach()
var $remove_li =$("ul li:eq(1)").detach( ); 和remove類似，但綁定的事件、附加的資料會保留下來
empty()
$("ul li:eq(1)").remove( ); 清空所選元素中所有的後代元素内容
複制元素節點：
clone()
$("li:eq(1)").clone(true).appendTo("ul");
複制第二個li元素插入到ul中，并傳遞了一個參數true代表複制元素同時複制元素中綁定的事件。
替換元素節點：
replaceWith()
$("li:eq(1)").replaceWith("<li>c</li>"); 替換掉第二個li元素
replaceAll() 和 replaceWith() 颠倒文法
包裹元素節點：
wrap() 用參數标簽把外面的标簽包裹起來
$("li").wrap(<i></i>);
wrapAll() 用參數标簽把多個标簽整體包裹起來，如其中有其他标簽則放到包裹元素後
wrapInner() 把比對到元素内部的内容用參數标簽包裹起來
節點屬性操作：
attr() 擷取前面元素的參數中的屬性，參數可以 kv 對用來設定屬性
removeAttr() 删除屬性
節點樣式操作：
addClass() 追加參數中的類選擇器，不同會疊加，相同會覆寫
removeClass() 删除類選擇器
toggleClass() 重複切換參數中的類選擇器，有就去除，沒有就使用
hasClass() 判斷是否含有參數中的類選擇器樣式，傳回boolean值
設定擷取值：
html() 設定内容會解析html語句，無參數時擷取
text() 設定内容不會解析語句，無參數時擷取
val()
設定input元素value值，下拉框選中項，
下拉清單多選項(需要用[]括起來，逗号分開多個值)，
複選框選中項，
單選框選中項，
無參數時擷取
周遊節點操作：
children() 取得比對元素的子元素集合
next() 取得後面緊鄰的同輩元素
prev() 取得前面緊鄰的同輩元素
parent() 取得比對元素的父級元素
parents() 取得比對元素的先輩元素的集合
siblings() 取得比對元素前後所有的同輩元素
closest() 取得最近的比對元素，先取自身如果自身不存在，則向父元素取最近的一個先輩
CSS-DOM技術：
$("p").css({"color":"#ff0000", "background":"blue"}); 不加參數是擷取css，加參數是修改css
scrollTop() 和 scrollLeft() 設定相對滾動條頂部和左側的偏移
offset() 擷取和設定元素在目前視窗的相對偏移
$("#dv").offset({top:10, left:30})；
var $offset = $("#dv").offset();
$("#dv").html("left:" + $offset.left + ",top:" + $offset.top);
position() 擷取比對元素相對父元素的偏移 五、屬性操作
操作屬性：
$("img").attr("src"); 傳回文檔中第一個圖像的src屬性值。
$("img").attr("src","test.jpg"); 為所有比對的元素設定一個屬性值
$("img").attr("title", function() { return this.src }); 為所有比對的元素設定一個計算的屬性值
$("img").removeAttr("src"); 從每一個比對的元素中删除一個屬性
$("img").attr({ src: "test.jpg", alt: "Test Image" }); 将一個“名/值”形式的對象設定為所有比對元素的屬性。
操作 CSS
$("p").addClass("selected"); 為每個比對的元素添加指定的類名
$("p").removeClass("selected"); 從所有比對的元素中删除全部或者指定的類。一個或多個要删除的CSS類名，請用空格分開
$("p").removeClass(); 删除比對元素的所有類
$("p").toggleClass("selected"); 如果存在（不存在）就删除（添加）一個類
var count = 0;
$("p").click(function(){
$(this).toggleClass("highlight", count++ % 3 == 0);
}); //每點選三下加上一次 'selected' 類
HTML代碼:
$("div").html(); 取得第一個比對元素的html内容
$("div").html("<p>Hello Again</p>"); 設定每一個比對元素的html内容
文本：
$("p").text(); 取得所有比對元素的内容
$("p").text("<b>Some</b> new text."); 設定所有比對元素的文本内容
值：
$("#single").val() 獲得第一個比對元素的目前值。
$("input").val("hello world!"); 設定每一個比對元素的值
六、篩選
過濾：
1、$("p").eq(1) 擷取第N個元素，這個元素的位置是從0算起
2、 if ( $(this).hasClass("protected") ) 檢查目前的元素是否含有某個特定的類，如果有，則傳回true。
3、$("p").filter(".selected") 篩選出與指定表達式比對的元素集合
4、is(expr) 用一個表達式來檢查目前選擇的元素集合，如果其中至少有一個元素符合這個給定的表達式就傳回true。
5、$("p").not( $("#selected")[0] ) 删除與指定表達式比對的元素
查找：
1、$("div").children();取得一個包含比對的元素集合中每一個元素的所有子元素的元素集合。
2、$("p").find("span");搜尋所有與指定表達式比對的元素。這個函數是找出正在處理的元素的後代元素的好方法。
3、$("p").next();取得一個包含比對的元素集合中每一個元素緊鄰的後面同輩元素的元素集合
4、$("p").prev();取得一個包含比對的元素集合中每一個元素緊鄰的前一個同輩元素的元素集合。
5、$("div").parent;取得一個包含着所有比對元素的唯一父元素的元素集合。
6、$("span").parents;找到每個span元素的所有祖先元素
7、$("div").siblings();取得一個包含比對的元素集合中每一個元素的所有唯一同輩元素的元素集合
七、文檔處理
内部插入：
1、$("p").append("<b>Hello</b>"); 向每個比對的元素内部尾部追加内容
2、$("p").prepend("<b>Hello</b>"); 向每個比對的元素内部前部追加内容
2、$("p").appendTo("#foo"); 把所有段落追加到ID值為foo的元素中。
外部插入：
1、$("p").after("<b>Hello</b>"); 在每個比對的元素之後插入内容
2、$("p").before("<b>Hello</b>"); 在每個比對的元素之前插入内容
包裹
1、$("p").wrap("<div class='wrap'></div>"); 把所有比對的元素用其他元素的結構化标記包裹起來。
替換：
1、$("p").replaceWith("<b>Paragraph. </b>"); 将所有比對的元素替換成指定的HTML或DOM元素。
删除：
1、$("p").empty(); 删除比對的元素集合中所有的子節點。
2、$("p").remove(); 從DOM中删除所有比對的元素
八、CSS 操作
CSS:
1、$("p").css("color"); 取得第一個段落的color樣式屬性的值
2、$("p").css({ color: "#ff0011", background: "blue" }); 把一個“名/值對”對象設定為所有比對元素的樣式屬性。
3、$("p").css("color","red"); 在所有比對的元素中，設定一個樣式屬性的值
位置：
1、var offset = p.offset();擷取比對元素在目前視口的相對偏移，傳回的對象包含兩個整形屬性：top 和 left。此方法隻對可見元素有效。
2、var position = p.position();擷取比對元素相對父元素的偏移
尺寸：
1、$("p").height(); 取得第一個比對元素目前計算的高度值（px）。
2、$("p").height(20); 為每個比對的元素設定CSS高度(hidth)屬性的值
3、$("p").width(); 取得第一個比對元素目前計算的寬度值（px）。$(window).width(); 擷取目前視窗的寬
4、$("p").width(20); 為每個比對的元素設定CSS寬度(width)屬性的值
九、效果
基本：
1、$("p").show() 顯示隐藏的比對元素
2、$("p").hide() 隐藏顯示的元素
3、$("p").show("slow"); 以優雅的動畫顯示所有比對的元素，并在顯示完成後可選地觸發一個回調函數。
speed(String,Number) : 三種預定速度之一的字元串("slow", "normal", or "fast")或表示動畫時長的毫秒數值(如：1000)
callback (Function) : (Optional) 在動畫完成時執行的函數，每個元素執行一次。
示例：用迅速的動畫将隐藏的段落顯示出來，曆時200毫秒。并在之後執行回報！
<p style="display: none">Hello</p>
//jQuery 代碼:
$("p").show("fast",function(){
$(this).text("Animation Done!");
}); 4、$("p").hide("slow"); 以優雅的動畫隐藏所有比對的元素，并在顯示完成後可選地觸發一個回調函數。
5、$("p").toggle() 切換元素的可見狀态
6、$("p").toggle("slow"); 以優雅的動畫切換所有比對的元素，并在顯示完成後可選地觸發一個回調函數 淡入淡出:
1、$("p").fadeIn("slow"); 通過不透明度的變化來實作所有比對元素的淡入效果，并在動畫完成後可選地觸發一個回調函數
2、$("p").fadeOut("slow"); 通過不透明度的變化來實作所有比對元素的淡出效果，并在動畫完成後可選地觸發一個回調函數。
3、$("p").fadeTo("slow", 0.66);$("p").fadeTo("slow", 0.66); 把所有比對元素的不透明度以漸進方式調整到指定的不透明度，并在動畫完成後可選地觸發一個回調函數 自定義：
1、$("#block").animate({
width: "90%",
height: "100%",
fontSize: "20em",
borderWidth: 10 }, 1000 ); 用于建立自定義動畫的函數。
十、事件
事件處理：
1、$("p").bind("click", function(){ alert( $(this).text() );}); 為每一個比對元素的特定事件（像click）綁定一個事件處理器函數
2、$("p").one("click",function(){alert(${this}.text());}) 當所有段落被第一次點選的時候，顯示所有其文本
3、trigger(type,[data])在每一個比對的元素上觸發某類事件
事件委派
$("p").live("click", function(){$(this).after("<p>Another paragraph!</p>");});
給所有目前以及将來會比對的元素綁定一個事件處理函數（比如click事件）。
也能綁定自定義事件。與bind()不同的是，live()一次隻能綁定一個事件
事件切換:
一個模仿懸停事件（滑鼠移動到一個對象上面及移出這個對象）的方法
$("td").hover(
function () {
$(this).addClass("hover");
},
function () {
$(this).removeClass("hover");
}
); 滑鼠懸停的表格加上特定的類 每次點選後依次調用函數。
$("td").toggle(
function () {
$(this).addClass("selected");
},
function () {
$(this).removeClass("selected");
}
); 事件 示例
$("p").blur(); 觸發每一個比對元素的blur事件
$("p").blur( function () { alert("Hello World!"); } ); 在每一個比對元素的blur事件中綁定一個處理函數
change()；change事件會在元素失去焦點的時候觸發，也會當其值在獲得焦點後改變時觸
change(fn);在每一個比對元素的change事件中綁定一個處理函數。
$("p").click(); 觸發每一個比對元素的click事件
$("p").click(function(){});在每一個比對元素的click事件中綁定一個處理函數
dblclick()；dblclick事件會在元素的同一點輕按兩下時觸發。
$("p").dblclick( function () { alert("Hello World!"); }); 在每一個比對元素的dblclick事件中綁定一個處理函數。
$(document).ready(function(){ $("#login").focus();}); 觸發每一個比對元素的focus事件。
$("input[type=text]").focus(function(){this.blur();}); 在每一個比對元素的focus事件中綁定一個處理函數。
keydown()；keydown事件會在鍵盤按下時觸發。
keydown(fn)；在每一個比對元素的keydown事件中綁定一個處理函數。
keypress()；觸發每一個比對元素的keypress事件
keypress(fn)；在每一個比對元素的keypress事件中綁定一個處理函數。
keyup()；觸發每一個比對元素的keyup事件
keyup(fn)；在每一個比對元素的keyup事件中綁定一個處理函數。
mousedown();
mouseup();
mousemove();
mouseover();
mouseout();
$("form:first").submit();送出本頁的第一個表單。
$("form").submit(function(){return false;});阻止頁面送出。 十一、ajax
ajax 請求
1、通用方式：
$.ajax(prop); prop是一個hash表，它可以傳遞的key/value有以下幾種:
(String)type：資料傳遞方式(get或post)。
((String)url：資料請求頁面的url
((String)data：傳遞資料的參數字元串，隻适合post方式
((String)dataType：期待資料傳回的資料格式(例如 "xml", "html", "script",或 "json")
((Boolean)ifModified： 當最後一次請求的相應有變化是才成功傳回，預設值是false
((Number)timeout:設定時間延遲請求的時間。可以參考$.ajaxTimeout
((Boolean)global：是否為目前請求觸發ajax全局事件，預設為true
((Function)error：當請求失敗時觸發的函數。
((Function)success：當請求成功時觸發函數
((Function)complete：當請求完成後出發函數 2、$.get(url, params, callback)
用 get 方式向遠端頁面傳遞參數，請求完成後處理函數，除了url外，其它參數任意選擇！
$.get("ajax.asp",
{name:"young", age:"25"},
function(data){ alert("Data Loaded: " + data); }
) 3、$.getJSON(url, params, callback)
用 get 方式向遠端 json 對象傳遞參數，請求完成後處理函數 callback
4、$.post(url, params, callback)
用 post 方式向遠端頁面傳遞參數，請求完成後處理函數 callback
十二、工具類
數組 和 對象操作
1、$.each(obj,callback); 通用例遍方法，可用于例遍對象和數組。
回調函數擁有兩個參數：
第一個為對象的成員或數組的索引，
第二個為對應變量或内容。
$.each( [0,1,2], function(i, n){alert( "Item #" + i + ": " + n );});
2、jQuery.grep(array,callback,[invert])；使用過濾函數過濾數組元素，此函數至少傳遞兩個參數：待過濾數組和過濾函數
3、$.map(array,callback);将一個數組中的元素轉換到另一個數組中
4、$.inArray(value,array);确定第一個參數在數組中的位置(如果沒有找到則傳回 -1 ),從0開始。
5、$.merge( [0,1,2], [2,3,4] )
合并兩個數組。傳回的結果會修改第一個數組的内容，
第一個數組的元素後面跟着第二個數組的元素，不去掉重複項。
6、$.unique(array);删除數組中重複元素
7、$.trim(" hello, how are you? "); 去掉字元串起始和結尾的空格
8、$.isArray(obj);測試對象是否為數組。
9、$.isFunction(obj); 測試對象是否為函數
URL
1、$.param(obj); 将表單元素數組或者對象序列化。是.serialize()的核心方法。
var params = { width:1680, height:1050 }; var str = jQuery.param(params); 2、$("form").serialize() ；序清單單内容為字元串，用于 Ajax 請求
十三、jquery 操作 單選框
if($("input[type='radio']:checked")){
var tt=$("input[name='chk']:checked").val();
} 十四、jquery 操作 複選框
var chkArr="";
$(".cc:checked").each(function(){
chkArr+=$(this).val()+"|";
}); 十五、jquery 實作 複選框 全選
var checked=$("#allchk").attr("checked");
$(".ww").each(function(){
if($(this).attr("checked")!=checked){$(this).click();}
316}); ![105道CSS 面試知識點總結[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)