Heim  >  Artikel  >  Web-Frontend  >  Einführung in die verschiedenen Selektoren von JQuery

Einführung in die verschiedenen Selektoren von JQuery

零下一度
零下一度Original
2017-06-26 11:55:351213Durchsuche

1. JQuery-Basisselektor

express description remarks
$("#idName") id选择器  
$(".className") 类选择器  
$("tagName") 标签选择器  
$("*") 通配符选择器  
$("tagName,.className,#idName,...") 群组选择器  

2. Hierarchischer Selektor

Aus der Eltern-Kind-Beziehung Wählen Sie Knoten basierend auf Geschwisterbeziehungen aus

express description remarks
$("a b") 选择a节点所有的后代节点b
( 包括子节点和孙节点 )
 
$("a>b") 选择a节点的所有子节点b
( 只包含子节点, 不包含孙节点 )
 
$("a+b") 选择a节点之后的第一个兄弟节点b  
$("a~b") 选择a节点之后的所有兄弟节点b 注意是 a 节点之后的兄弟节点,
而不是所有的兄弟节点

3. Grundlegende Filterauswahl

Tags aus der Perspektive der Position filtern.

express description remarks
$("tagName:first") 选取tagName元素集合中的第一个元素  
$("tagName:last") 选择tagName元素集合中的最后一个元素  
$("tagName:odd") 选择tagName元素集合中奇数位置的元素  
$("tagName:even") 选择tagName元素集合中偶数位置的元素  
$("tagName:eq(1)") 选择tagName元素集合中第二个元素
( 索引和数组一样, 从零开始 )
 
$("tagName:gt(2)") 选择tagName元素集合中第三个元素往后的元素
( 即tagName下, 位置大于3的元素 )
 
$("tagName:lt(2)") 选择tagName元素集合中第三个元素往前的元素
( 即tagName下, 位置小于3的元素 )
 
$(":header") 选中所有的标题元素
( h1 到 h6 )
 
$(":animated") 选择有动画的元素  
$("tagName:not(.one)") 选择tagName元素集合中class值不是one的元素  

4. Inhaltsfilterauswahl

Ob der Knotenwert leer ist und ob der Text auf dem Knoten die angegebene Zeichenfolge enthält, ob Der Klassenwert im Unterelement ist der angegebene Wert.

express description remarks
$("tagName:empty") 选择tagName元素集合中内容为空的元素
( 不是子元素 )
 
$("tagName:parent") 选择tagName元素集合中包含子元素的元素  
$("tagName:contents('abc')") 选择tagName元素集合中内容包含"abc"的元素
( 不是子元素 )
 
$("tagName:has(.one)") 选择tagNmae元素集合中class值为one的元素
( 不是子元素, 是tagName元素 )
 

5. Attributfilter (wählen Sie Elemente aus, die bestimmte Attribute enthalten)

Filtern Sie Knoten basierend auf ihren Attributen: mit oder ohne Attribute, Attributwerte ​​sind gleich, ungleich, einschließen, beginnen mit **, enden mit **, Mehrfachfilterung >6 . Der Sichtbarkeitsfilterselektor

wählt Knoten basierend darauf aus, ob das Element auf der Seite sichtbar ist oder nicht
express description remarks
$("div[id]") 被选中的元素包含id属性  
$("div[id='test']") 被选中的元素包含id="test"  
$("div[title!='test']") 被选中的元素的title属性不是"test"  
$("div[title^='te']") 被选中的元素的title属性值是由"test开始的"  
$("div[title$='st']") 被选中的元素的title属性是以"test"结尾的  
$("div[title*='est']") 被选中的元素的title属性值包含"est"  
$("div[title*='est'][id]") 被选中的元素的title属性值包含"est",
且有id属性
 

Das obige ist der detaillierte Inhalt vonEinführung in die verschiedenen Selektoren von JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn