Klassifizierungsanalyse des jQuery-Selektors

Basisselektor:

#id Entspricht einem Element basierend auf der ID

.class Entspricht einem Element basierend auf dem angegebenen Klassennamen.

element Entspricht einem Element basierend auf der Elementname

* Entspricht allen Elementen

selecttor1,selector2 Union, gibt die von den beiden Selektoren übereinstimmenden Elemente zurück

Hierarchischer Selektor:

Vorfahr Nachkomme Gemäß Ancestor stimmt mit allen untergeordneten Elementen überein

parent>child Stimmt mit allen untergeordneten Elementen gemäß dem übergeordneten Element überein, direkte Nachkommen

prev+next Der Abgleich mit dem nächsten Geschwisterelement entspricht der next()-Methode

prev~siblings Der Abgleich der folgenden Geschwisterelemente entspricht der Methode nextAll(). Die Methode siblings() gleicht alle Geschwisterelemente ab

Einfacher Filterselektor:

:first oder first( ) Matching Das erste Element

:last or last() Entspricht dem letzten Element

:not(selector) Entspricht Elementen, die vom Selektor nicht abgeglichen werden können

:even Entspricht dem Indexwert Für Elemente mit einer geraden Nummer beginnt die Indexnummer bei 0

:odd Entspricht dem Element mit einer ungeraden Nummer, die Indexnummer beginnt bei 0

:eq(index) Entspricht dem Element mit der angegebenen Indexnummer, index Die Nummer beginnt bei 0

　:gt(index)　　　　 Entspricht dem Element, dessen Indexnummer größer als der angegebene Indexwert ist, und die Indexnummer beginnt bei 0

　　:lt(index)　　　　 Entspricht dem Element, dessen Indexnummer kleiner als der angegebene Indexwert ist. Elemente mit Indexnummern beginnend bei 0

:header Entspricht allen Header-Elementen h1 h2 h3 h4 h5 h6

:animated Entspricht allen Elementen, die eine Animation ausführen

Inhaltsfilterungsselektor:

:contains(text) Entspricht Elementen, die den angegebenen Text enthalten

:empty Entspricht allen leeren Elementen, die enthalten keine untergeordneten Elemente oder Text

:has(selector )　　　 Passt auf Elemente, deren Nachkommen Selektoren enthalten, die mit dem Element

übereinstimmen können. :parent　　　 Passt auf Elemente, die untergeordnete Elemente oder Text enthalten

Sichtbarkeitsfilterauswahl:

:hidden           Passt nicht zu Sichtbare Elemente oder Elemente mit type="hidden", die den CSS-Stil enthalten: display: "none";, unabhängig davon, ob das CSS inline, importiert oder verknüpft ist

　:visible　　　　　　 Alle sichtbaren Elemente abrufen

Attributfilterauswahl:

[attribute] Entspricht Elementen, die das angegebene Attribut enthalten

[attribute=value] Entspricht Elementen

[attribute !=value]　　 Übereinstimmung mit Elementen, die Attribute enthalten, aber !=value

　[attribute^=value]　　 Übereinstimmung mit dem Attributwert ist das Element, das mit dem Wert

　[attribute$= beginnt value]　　 Match-Attributwert ist Elemente, die mit value enden

[attribute*=value] Übereinstimmende Elemente, deren Attributwerte bestimmte Werte enthalten, vor und nach Teilen und in der Mitte werden ebenfalls gezählt

[selector][selector] Passende Attributselektoren Die Schnittmenge von

Filterselektor für untergeordnete Elemente:

:nth-child(eq|even|odd|index) Ruft alle untergeordneten Elemente zu einem bestimmten Zeitpunkt ab Position des übergeordneten Elements

:first Das erste untergeordnete Element unter allen übergeordneten Elementen abrufen

:last Das letzte untergeordnete Element unter allen übergeordneten Elementen abrufen

:only-child Get das einzige Element

unter allen übergeordneten Elementen

Filterauswahl für Formularobjektattribute:

:aktiviert Alle verfügbaren Elemente im Formular abrufen

:deaktiviert Alle nicht verfügbaren Elemente im Formular abrufen

:checked Alle ausgewählten Elemente des Formulars abrufen

:selected Alle ausgewählten Optionselemente im Formular abrufen

Formularauswahl:

:input Alle Formulare abrufen elements009225a132c538e76a6cd5149b867cfc

:password Alle Elemente des Passwortfelds abrufen b4d4d50c09f85f8bd42661feb9560795

:radio Alle Optionsfelder abrufen53566975f0144005a2bc7344d013535e

:checkbox Alle Kontrollkästchen abrufen10418f8438a424acd54320a68c668afe

:submit Alle Sendeschaltflächen abrufen 304ad795417f176379d121aa93b316e4

:image Alle Bildschaltflächen abrufen 7c696951595ca52af93ef62fe7bceaa5

: reset Alle Reset-Schaltflächen abrufeneeca75b0568ea805e682104191241965

:button Alle Schaltflächen abrufen8e03557d3950bf880a2e4583affa2fab

:file Alle Datei-Upload-Felder abrufen61b9b53f6d762f7c3b14ccfc7d4eaf40

1. Basisselektor

　(1), #id Übereinstimmung mit einem Element basierend auf der ID

$("#div1").css("background-color","red");　　//匹配id为"div1"的元素
<div id="div1">我是一个DIV</div> //会选中该div元素

(2), Element Entspricht dem Element

$("p").css("background-color","red");　　　　//匹配页面所有的p元素
<p>我是一个P</p>

entsprechend dem angegebenen Elementnamen

(3), Klasse Entspricht Elementen

$(".important").removeClass();　　　　//匹配所有class="important"元素
<p class="important">我是一个p元素</p>

gemäß Klassenattribut

(4), * Entspricht allen Elementen

$("* ").css("background- color","red");

　(5), selector1,selector2 Trennen Sie die Selektoren durch Kommas und geben Sie die Elemente zurück, die mit jedem Selektor übereinstimmen

　　$(".div1,#span1") .css("background-color",red");

2. Hierarchieselektor

(1), Vorfahren-Nachkomme Basierend auf Vorfahren Das Element stimmt mit allen Nachkommenelementen und dem übereinstimmenden Nachkommen überein Elemente werden durch Leerzeichen getrennt zurückgegeben.

$("#div1 span").css("color","red");
 
　　　　<div id="div1">
　　　　　　<span>我是span1</span>　　　　　***会被选中，是#div1的后代span
　　　　　　<div>
　　　　　　　　<span>我是span3</span>　　　***会被选中，也是#div1的后代span
　　　　　　</div>
　　　　</div>
　　　　<span>我是span2</span>　　　　　　　***不会被选中，不是#div1的后代

(2), übergeordnetes Element > Alle untergeordneten Elemente basierend auf dem übergeordneten Element abgleichen und alle untergeordneten Elemente durch ein Größer-als-Zeichen getrennt zurückgeben. >"

$("#div1 > span").css("color","red");
　　　　<div id="div1">
　　　　　　<span>我是span1</span>　　　　　***会被选中，是#div1的子元素span
　　　　　　<div>
　　　　　　　　<span>我是span3</span>　　　***不会被选中，是#div1的后代元素，但不是直接子元素
　　　　　　</div>
　　　　</div>
　　　　<span>我是span2</span>　　　　　　　***不会被选中，不是#div1的子元素

(3), prev + next Entspricht dem nächsten angrenzenden Element unmittelbar nach dem vorherigen Element, getrennt durch ein Pluszeichen „+“.

Entspricht der .next()-Methode

$(".p1 + p").css("color","red");　　　　//此行代码相当于$(".p1").next().css("color","red");
　　　<div>
　　　　　<p>我是第一个P</p>　　　　　　***不会被选中，是class为p1的上一个了
　　　　　<p class="p1">我是第二个P</p>　　***prev本身并不会被选中
　　　　　<p>我是第三个P</p>　　　　　　***会被选中，是class为p1的下一个相邻元素
　　　　　<p>我是第四个P</p>　　　　　　***不会被选中，不是class为p1的下一个，是下二个了
　　　</div>

(4), prev ~ sibings Wird verwendet, um alle Geschwisterelemente nach prev abzugleichen Wellenlinien „~“ trennen

Entspricht der Methode nextAll()

$(".p1 + p").css("color","red");　　　　//此行代码相当于$(".p1").nextAll("p").css("color","red");
　　<div>
　　　　<p>我是第一个P</p>　　　　　　***不会被选中，是class为p1前面的元素
　　　　<p class="p1">我是第二个P</p>　　***prev本身并不会被选中
　　　　<p>我是第三个P</p>　　　　　　***会被选中，是class为p1后面的P兄弟元素
　　　　<p>我是第四个P</p>　　　　　　***会被选中，也是class为p1后面的P兄弟元素
　　</div>

(5), alle Geschwisterelemente auswählen siblings() Methode

$(".p1").sibings("p").css("color","red");
　　<div>
　　　　<p>我是第一个P</p>　　　　　　***会被选中，是class为p1的P兄弟元素
　　　　<p class="p1">我是第二个P</p>　　***prev本身并不会被选中
　　　　<p>我是第三个P</p>　　　　　　***会被选中，是class为p1的P兄弟元素
　　　　<p>我是第四个P</p>　　　　　　***会被选中，也是class为p1的P兄弟元素
　　</div>

3. Einfacher Filterselektor

　(1), first() oder:first　　Wählen Sie die Bedingungen aus, die mit The first übereinstimmen element

$("#div1 > p:first").css("color","red")　　//此行代码相当于　　$("#div1 > p").first().css("color","red");
　　　<div id="div1">
　　　　　<p>我是第一个P</p>　　　***会被选中，是id为#div1下的第一个P元素
　　　　　<p>我是第二个P</p>　　　***不会被选中，是第二个P元素了
　　　　　<p>我是第三个P</p>　　　***不会被选中，是第三个P元素了
　　　</div>

(2), last() oder:last　 Das letzte Element, das die Bedingung

$("#div1 > p:last").css("color","red");　　　　//此行代码相当于　$("#div1 > p").last().css("color","red");
　　　<div id="div1">
　　　　　<p>我是第一个P</p>　　　***不会被选中，是第一个
　　　　　<p>我是第二个P</p>　　　***不会被选中，是第二个
　　　　　<p>我是第三个P</p>　　　***会被选中，id为#div1下的最后一个P元素
　　　</div>

(3), :not(selector)　 Elemente, die die Bedingungen erfüllen, aber nicht vom Selektor ausgewählt werden können

$("#div1 > p:not('.p1')").css("color","red");
　　<div id="div1">
　　　　<p>我是第一个P</p>　　　　　　　　***会被选中
　　　　<p class="p1">我是第二个P</p>　　***不会被选中，因为符合了:not里的条件 class="p1"
　　　　<p>我是第三个P</p>　　　　　　　　***会被选中
　　</div>

(4), :even Holen Sie sich die Elemente mit geraden Zahlen (0, 2, 4, 6, 8...) Beachten Sie, dass die Indexnummern bei 0 beginnen

$("#div1 > p:even").css("color","red");
　　　<div id="div1">
　　　　　<p>我是第一个P</p>　　***会被选中，索引号0
　　　　　<p>我是第二个P</p>　　***不会被选中，索引号1
　　　　　<p>我是第三个P</p>　　***会被选中，索引号2
　　　　　<p>我是第四个P</p>　　***不会被选中，索引号3
　　　　　<p>我是第五个P</p>　　***会被选中，索引号4
　　　</div>

(5), odd　　　　Erhalten Sie die Elemente mit ungeraden Indexwerten (1, 3, 5, 7, 9 ...), beachten Sie, dass die Indexnummer bei 1 beginnt

$("#div1 > p:odd").css("color","red");
　　　<div id="div1">
　　　　　<p>我是第一个P</p>　　***不会被选中，索引号0
　　　　　<p>我是第二个P</p>　　***会被选中，索引号1
　　　　　<p>我是第三个P</p>　　***不会被选中，索引号2
　　　　　<p>我是第四个P</p>　　***会被选中，索引号3
　　　　　<p>我是第五个P</p>　　***不会被选中，索引号4
　　　</div>

(6), eq(index)　　 Wählen Sie das Element mit dem angegebenen Indexwert aus, der Indexwert beginnt bei 0

$("#div1 > p:eq(1)").css("color","red");
　　　<div id="div1">
　　　　　<p>我是第一个P</p>　　***不会被选中，索引号为0
　　　　　<p>我是第二个P</p>　　***不会被选中，索引号为1
　　　　　<p>我是第三个P</p>　　***不会被选中，索引号为2
　　　　　<p>我是第四个P</p>　　***不会被选中，索引号为3
　　　</div>

(7), gt(index)　　Erhalten Sie alle Elemente, deren Indexwert größer als der Index ist. Die Indexnummer beginnt bei 0

$("#div1 > p:gt(1)").css("color","red");
　　　<div id="div1">
　　　　　<p>我是第一个P</p>　　***不会被选中，索引号为0
　　　　　<p>我是第二个P</p>　　***不会被选中，索引号为1
　　　　　<p>我是第三个P</p>　　***会被选中，索引号为2大于1了
　　　　　<p>我是第四个P</p>　　***会被选中，索引号为3大于1了
　　　</div>

　(8), lt(index)　　Erhalten Sie alle Elemente, deren Indexwert kleiner als der Index ist. Die Indexnummer beginnt bei 0

$("#div1 > p:lt(1)").css("color","red");
　　<div id="div1">
　　　　<p>我是第一个P</p>　　***会被选中，索引号为0，小于1
　　　　<p>我是第二个P</p>　　***不会被选中，索引号为1，不小于1
　　　　<p>我是第三个P</p>　　***不会被选中，索引号为2大于1了
　　　　<p>我是第四个P</p>　　***不会被选中，索引号为3大于1了
　　</div>

(9), :header　　　Alle Header-Typelemente h1, h2, h3, h4, h5, h6 abrufen

$("#div1 > :header").css("color","red");
　　 <div id="div1">
　　　　　<p>我是一个P</p>　　　　　　***不会被选中，不是标题类型元素
　　　　　<span>我是一个span</span> ***不会被选中，不是标题类型元素
　　　　　<h1>我是一个h1</h1>　　　　***会被选中，h1是标题类型元素
　　　　　<h6>我是一个h6</h6>　　　　***会被选中，h6是标题类型元素
　　　</div>

(10), animiert Elemente, die Animationseffekte ausführen

4. Inhaltsfilterauswahl

(1), :contains(text) Ruft das Element ab, das den angegebenen Text enthält

$("p:contains('三')").css("background-color","red");
　<div>
　　<p>我是第一个P</p>　　***不会被选中
　　<p>我是第二个P</p>　　***不会被选中
　　<p>我是第三个P</p>　　***会被选中，文本里包含了"三"
　</div>

　(2), :empty Holen Sie sich ein leeres Element, das keine untergeordneten Elemente oder Text enthält

$(:empty).text("我是空元素");
　　　　<div>
　　　　　　<div><span></span></div>　　***div不会被选中，因为有<span></span>子元素。<span></span>会被选中，因为没有子元素也没有文本元素
　　　　　　<p></p>　　　　　　　　　　　　***会被选中，没有子元素，也没有文本元素
　　　　　　<span>我是一个span</span>　　***不会被选中,有文本元素
　　　　</div>

( 3), :has(selector )　Wählen Sie das Element aus, das das vom Selektor übereinstimmende Element enthält (beachten Sie, dass es nicht auf direkte untergeordnete Elemente beschränkt ist, solange die Nachkommen es enthalten)

$("div:has('span')").css("background-color","red");
　　　　<div>　　　　　　　　　　***此div会被选中，因为他的有孙子span
　　　　　　我是最外层div　　　　
　　　　　　<div><p>我是一个P</p></div>　　　　***此div不会被选中，因为不含有后代span
　　　　　　<div><span>我是一个span</span></div>　　***此div会被选中，含有后代span
　　　　</div>

(4), :parent　Elemente, die untergeordnete Elemente oder Textelemente enthalten

$(":parent").text("不含子元素或文本元素");
　　　<div>我是一个div</div>　　***不会被选中，因为含有文本元素
　　　<div><span>我是一个span</span></div>　　***不会被选中，含有子元素。
　　　<div></div>　　　　　　　　***会被选中，不含子元素也不含有文本元素

5 🎜>

(1), :hidden Alle unsichtbaren Elemente auswählen

$("span:hidden").css("display","block");
 $("input:hidden").val("我是jQuery");
　 <span style="display:none">我是一个span</span>　　***会被第一条规则选中
　　　 <input type="hidden" value="我是一个隐藏的input" />　***会被第二条jQuery选中
　　　 <span class="span1">我是span1</span>　　　　　　　***会被第一条jQuery选中

(2), :visible Alle sichtbaren Elemente auswählen

6. Attributfilterselektor

　(1), [attribute] Holen Sie sich das Element, das das angegebene Attribut enthält

$("div[class]").css("font-size","30px");
　<div>
　　　<div class="div1">我是第一个div</div>　　***会被选中，含有class属性
　　　<div>我是第二个div</div>　　　　　　　　 ***不会被选中，没含有class属性。
　</div>

(2 ), [attribute=value] Holen Sie sich die Attributelemente, deren Wert gleich value ist

$("div[class=div1]").css("font-size","30px");
　　<div>
　　　　<div class="div1">我是div1</div>　　***会被选中，class属性等于div1。
　　　　<div class="div2">我是div2</div>　　***不会被选中,class属性不等于div1。
　　</div>

(3), [attribute!=value] Elemente abrufen dessen Attributwert nicht gleich dem Wert

$("div[class!=div1]").css("color","red");
<div>我是一个没有class属性的div</div>　　　　　　　　　　 ***会被选中，没有class属性自然class属性不等于div1
<div class="div2">我是一个class属性等于div2的div</div>　　 ***会被选中，class属性不等于div1
<div class="div1">我是一个class属性等于div1的元素</div>　　***不会被选中，class属性等于div1

ist (4), [attribute^=value] Ruft das Element ab, dessen Attributwert mit dem Wert

$("div[class^=div]").css("color","red');
<div class="div1">我是div1</div>　　***会被选中，class属性以div开始
<div class="div2">我是div2</div>　　***会被选中，class属性以div开始
<div class="abc">我是div3</div>　　 ***不会被选中，class属性不以div开始

　(5), [attribute$=value] Holen Sie sich das Element, dessen Attributwert mit value endet

　　(6)、[attribute*=value]　　获取属性值包含value值元素

$("div[class*=div]").css("font-size","30px");
<div class="div1">我是div1</div>　　***会被选中，属性值包含div
<div class="1div">我是1div</div>　　***会被选中，属性值包含div
<div class="1div1">我是1div1</div> ***会被选中，属性值包含div
<div class="abc">我是abc</div>　　　***会被选中，属性值包含div

   

　　(7)、[selector][selector][selector]　　获取属性交集元素

$("div:[class][title=title1]").css("background-color","red");
<div class="div1" title="title1">我是div1,title1</div>　　***会被选中，有class属性且title属性等于title1
<div class="div1" title=title2>我是div1,title2</div>　　　***不会被选中，虽然有class属性，但是title属性不等于title2
<div class="div3">我是div3</div>　　　　　　　　　　　***不会被选中，没有title属性

   

7、子元素过滤选择器

　　　(1):nth-child(eq|even|odd|index)　　　　获取每个父元素下的特定位置元素，索引号从1开始

$("div>p:nth-child(1)").css("background-color","red");　　//选中每一个父元素下的div下的第一个直接P元素
<div>
　　<p>我是第一个P</p> 　　*** 会被选中，是div下的第一个子P元素
　　<p>我是第二个P</p> 　　*** 不会被选中，是第二个了
</div>
<div>
　　<P>我是第三个P</P> 　　*** 会被选中，是div下的第一个子P元素
　　<P>我是第四个P</P> 　　*** 不会被选中，是第二个了
</div>

   

(2):first-child　　　　选中每个父元素下的第一个

$("p:first-child").css("background-color","red");　　　　//选中每一个父元素下的第一个P元素
<div>
　　<p>我是第一个P</p> 　　*** 会被选中，是div下的第一个子P元素
　　<p>我是第二个P</p> 　　*** 不会被选中，是第二个了
</div>
<ul>
　　<li>
　　　　<P>我是第三个P</P> 　　*** 会被选中，是div下的第一个子P元素
　　　　<P>我是第四个P</P> 　　*** 不会被选中，是第二个了
　　</li>
</ul>

   

(3)、:last-child　　选中每一个父元素下的最后一个元素

$("p:last-child").css("background-color","red");　　　　//选中每一个父元素下的第一个P元素
<div>
　　<p>我是第一个P</p> 　　*** 不会被选中，不是某父元素的最后一个子P元素
　　<p>我是第二个P</p> 　　*** 会被选中，是div元素下的最后一个子P元素
</div>
<ul>
　　<li>
　　　　<P>我是第三个P</P> 　　*** 不会被选中，不是某父元素下的最后一个子P元素
　　　　<P>我是第四个P</P> 　　*** 会被选中，是div元素下的最后一个P元素
　　</li>
</ul>

   

(4)、:only-child　　获取每个父元素下唯一仅有的一个子元素

$("p:only-child").css("background-color","red");
　　<div>
　　　　<p>我是第一个P</p>　　***不会被选中，不是某父元素下的唯一一个P元素
　　　　<p>我是第二个P</p>　　***不会被选中，不是某父元素下的唯一一个P元素
　　</div>
　　<div>
　　　　<span>我是一个span</span>　　***不会被选中，不是某父元素下的唯一一个P元素
　　　　<p>我是第三个P</p>　　　　　　 ***不会被选中，不是某父元素下的唯一一个span元素
　　</div>
　　<div>
　　　　<p>我是一个P</p>　　　　***会被选中，是div下的唯一一个P元素
　　</div>

   

8、表单对象属性过滤选择器

　　(1)、:enabled　　获取表单中所有属性为可用的元素

$("input:enabled").val("jQuery表单对象属性过滤选择器");
　　<div>
　　　　<input type="text" value="我是一个可用的input" />　　　　***会被选中，是一个可用的表单元素
　　　　<input type="text" value="我是一个不可用的input" disabled="disabled" />　　***不会被选中，是不可用的表单元素
　　</div>

   

(2)、:disabled　　获取表单中属性不可用的元素

$("input:enabled").val("jQuery表单对象属性过滤选择器");
<div>
　<input type="text" value="我是一个可用的input" />　　　　***不会被选中，是一个可用的表单元素
　<input type="text" value="我是一个不可用的input" disabled="disabled" />　　***会被选中，是不可用的表单元素 //注意，jQuery能够操作不可用　　　的表单元素
</div>

   

(3)、:checked　　　　获取表单中被选中的元素　　从属性能够知道用户选中了哪个

$("input:checked").val("jQuery");
　　<div>
　　　　<input type="checkbox" checked="checked" value="1">选中
　　　　<input type="checkbox" value="0">未选中
　　</div>

   

(4)、:selected　　　　获取表单中被选中的元素　　此属性能够知道用户选择了哪个

alert($("input:selected").text(""));　　//获取所有被选中的option元素
　　<div>
　　　　<selected>
　　　　　　<option value="0" selected="selected">option1</option>　　***会被选中
　　　　　　<option value="1">option2</option>　　　　　　　　　　***不会被选中，因为本option不是选中的。
　　　　</selected>
　　</div>

   

9、表单选择器

(1)、:input　　获取所有的input、textarea、select

$(":input").val("jQuery");
　　<div>
　　　　<textarea>我是一个兵</textarea>　　***会被选中
　　　　<input text="button" value="" />　　***会被选中
　　　　<p>我是一个P</p>　　　　　　　　　　***不会被选中
　　</div>

   

(2)、:text　　获取所有的单行文本框，也就是ec1428ba487b0fd5d7fe857f9d4b2faa元素

$(":text").val("jQuery");
　　<div>
　　　　<input type="text" value="我是一个input" />　　***会被选中，是单行文本框
　　　　<input type="button" value="确定" />　　　　　 ***不会被选中，不是单行文本框
　　　　<textarea>我是一个textarea</textarea>　　　　 ***不会被选中，不是单行文本框
　　</div>

   

(3)、:password　　获取所有的密码框　　也就是c1316d16b1c962d004723ea50186d536元素

$(":password").hide(3000);
<div>
　　<input type="password" />　　　　***会被选中，是密码框
　　<input type="text" value="我是一个文本框" />　　***不会被选中，是文本框
</div>

   

(4)、:radio　　获取所有的单选按钮

$(":radio").hide(3000);
<div>
　　<input type="radio" />我是一个radio　　***单选按钮会被选中，但是后面的文字不会
　　<input type="text" />我是一个文本框　　***不会被选中
</div>

   

(5)、：checkbox　　获取所有的复选框

$(":checkbox").hide(3000);
<div>
　　<input type="checkbox" />我是一个checkbox　　***复选框会被选中，文本不会
　　<input type="text" />我是一个文本框　　　　　　 ***不会被选中，不是复选框
</div>

   

(6)、:submit　　　　获取所有的提交按钮

$(":submit").hide(3000);
<div>
　　<input type="submit" value="提交">　　　　　　***会被选中，是提交按钮
　　<input type="text" value="我是一个文本框">　　 ***不会被选中，不是提交按钮
</div>

   

(7)、:image　　　　获取所有的图像域

$(":image").attr("title","我是一个图片按钮");
<div>
　　<input type="image" src="http://www.baidu.com/img/baidu_sylogo1.gif" />　　***会被选中
　　<input type="text" value="我是一个文本框" />　　　　　　***不会被选中，不是图片按钮
</div>

   

(8)、:reset　　　　获取所有重置按钮

$(":reset").hide(3000);
<div>
　　<input type="reset" value="重置">　　　　　　***会被选中，是重置按钮
　　<input type="text" value="我是一个文本框">　 ***不会被选中，不是重置按钮
</div>

   

(9)、:button　　　　获取所有的按钮

$(":button").hide(3000);
<div>
　　<input type="button" value="确认" />　　　　　　***会被选中，是按钮元素
　　<input type="text" value="我是一个文本框" />　　 ***不会被选中，不是按钮元素
</div>

   

(10)、:file　　　　获取所有的文件域

$(":file").hide(3000);
<div>
　　<input type="file" title="file" />
　　<input type="text" value="我是一个文本框" />
</div>