jquery筆記一

層級選擇器
$('div > p') //div下的直接子元素p
$('div p') //div下的所有元素p
$(".prev + div")//緊挨着的兄弟節點,.prev後面的div
$(".prev ~ div")//.prev之後的所有div


基本選擇器
$(".div:first") //獲取首個元素
$(".div:last") //獲取最後一個元素
$(".div:even") //索引爲偶數元素
$(".div:odd") //索引爲奇數元素
$(".aaron:eq(2)") //索引爲2的元素
$(".aaron:gt(3)") //索引大於3的元素
$(".aaron:lt(2)") //索引小於2的元素
$("input:not(:checked)") //不匹配的input
$("div:contains('string')") //包含string的元素返回 p span等直接包含的標籤
$("div:has('string')") //返回div中包含string的div
$("a:parent") //有內容(子元素或文本)的元素
$("a:empty") //無內容的元素
$('#div3:visible') //顯示的元素
$('#div1:hidden') //隱藏的元素

屬性選擇器
$('div[name=p1]') //與屬性值相等的元素
$('div[p2]') //包含屬性的元素
$('div[name|="string"]') //屬性值等於string 或 string-* 的元素
$('div[name~="string"]') // 屬性值等於string 或 * string * 的元素
$('div[name^=string]') //屬性值已string開頭的元素
$('div[name$=string]') //屬性值已string結束的元素
$('div[name*=string]') //屬性值包含的string的元素
$('div[name!=string]') //屬性值不等於string的元素

子元素選擇器
$('div a:first-child') //div的第一個a
$('div a:last-child') //div的最後一個a
$('div a:only-child') //div下只有一個a的a
$('div a:nth-child(2)') //div下第二個a == eq(1) eq 從0開始
$('div a:nth-last-child(2)') //div下倒數第二個a

表單元素選擇器
$(':input') //獲取所有input 元素
$('input:text') //文本框
$('input:password') //密碼框
$('input:radio')//單選按鈕
$('input:checkbox')//複選按鈕
$('input:submit')//提交按鈕
$('input:image') //image按鈕 註釋:類型爲image的input有submit功能
$('input:button')//按鈕
$('input:file')//文件

表單對象屬性篩選選擇器
$('input:enabled') //選取可用的元素
$('input:disabled') //不可用的元素
$('input:checked') //被選中的單選或複選框
$('option:selected') //選中的option

元素樣式設置
$obj.toggleClass //樣式切換
$obj.css("background-color") //樣式取值
$obj.css(["background-color","width"]) //樣式取值返回數組
$obj.css({"background-color":red,"width":"100px"})//樣式賦值

數據存儲
$obj.data("key","value") //爲對象數據存儲 ,但key不在html可見
$obj.data("key") //獲取對象數據值

jQuery.data($obj, key, value ) //存數據
jQuery.data($obj, key ) //取數據 問題:$obj如果不是與存儲時同一次獲取,則取不出值

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章