jquery--選擇器

jquery複習--選擇器

 

一,基本選擇器

1,id 選擇器 var $div = $("#idName"); 和DOM的document.getElementById("id"); 2,class類選擇器 var $div= $(".className") ;和 DOM的document.getElementsByClassName("className"); 3,element選擇器 var $element= $("elementName");和DOM的document.getElementsByTagName('elementName');

二,層選擇器

1,var $p=$("div>p");div中第一代子元素p; 2,var $p=$("div p");div中全部的子元素p; 3,var $p=$(「.class+div」);類class後的兄弟元素; 4,var $p=$(「.class~div」);類class後的全部兄弟元素;

三,刷選選擇器

1,var $div=$(「.class:first」);找到第一個元素;var $div=$(「.class:last」);找到最後一個元素; 2,var $p=$(「.class>p:eq(2)」);在匹配的元素集合中選擇第二個p元素; 3,var $div=$(「.class>p:gt(3)」)在匹配的元素集合中選擇大於3的p元素 4,var $div=$(「.class>p:even」);選擇匹配的元素集合中選擇爲偶數的p元素; 5,var $div =$(「.class>p:odd」);選擇匹配的元素集合中選擇爲奇數的p元素; 6,var $div=$(「.class>p:lt(2)」);選擇匹配的元素集合中選擇小於2的p元素; 7,var $header=$(「:header」);選擇全部的標題元素; 8,var $animated=$(:animated);選擇全部正在執行動畫效果的元素; 9,var $root=$(「:root」);選擇該文檔的根元素; 10,var $visible=$(「:visible」);選擇全部的可見元素; 11,var $hidden=$(「:hidden」);選擇全部的隱藏元素;

四,屬性選擇器

1,var $div=$(「div[name=’p1’]」);在全部的div元素中選擇屬性name爲p1的元素; 2,var $div=$(「[name]」);選擇全部的div有name屬性的元素; 3,var $div=$([「div[name~=’a’]」);查找全部div中，有屬性name中的值包含一個連字符「空」和「a」的div元素; 4,var $div=$(「div[name!=’p1’]」);查找全部div中，有屬性name中的值沒有包含"p1"的div; 5,var $div=$(「div[name*=’p1’]」);查找全部div中，有屬性name中的值包含一個p1字符串的div元素 6,var $div=$(「div[name^=’p1’]」);查找全部div中，屬性name的值是用p1開頭的 7,var $div=$(「div[name$=’p1’]」);查找全部div中，屬性name的值是用p1結尾的

五,子元素刷選器

1,var $div=$(「.class>p:first-child」);選擇全部父級元素下的第一個子元素; 2,var $div=$(「.class>p:last-child」);選擇全部父級元素下的最後一個子元素; 3,var $div=$(「.class>p:only-child」);若是父級元素只有一個子元素，那麼子元素會被選中; 4,var $div=$(「.class>p:nth-child(2)」);選擇父元素的第2個子元素

六,表單選擇器

1,var $input=$(「:input」);選擇全部的textarea input button select元素; 2,var $input=$(「input:text」);匹配全部的文本框; 3,var $input=$(「input:password」);匹配全部的密碼框; 4,var $input=$(「input:radio」);匹配全部的單選框; 5,var $input=$(「input:checkbox」);匹配全部的複選框; 6,var $input=$(「input:submit」);匹配全部的提交按鈕; 7,var $input=$(「input:reset」);匹配全部的重置按鈕; 8,var $input=$(「input:image」);匹配全部的圖像域; 9,var $input=$(「input:button」);匹配全部的按鈕; 10,var $input=$(「input:file」);匹配多有的文件域;

七,表單屬性選擇器

1,var $input=$(「input:enabled」);匹配全部的可用的表單元素; 2,var $input=$(「input:disabled」);匹配全部的不可用的表單元素; 3,var $input=$(「input:checked」);匹配全部的被選擇的input元素; 4,var $input=$(「input:selected」);匹配全部的被選中的option元素;