Detaillierte Erklärung des jQuery-Selektors (vorherige ~ Geschwister)

jQuerys prev ~ Der Geschwisterselektor wird verwendet, um die Geschwisterelemente aller Geschwister nach dem prev-Element abzugleichen, sie in jQuery-Objekte zu kapseln und gib sie zurück.

Hinweis: Der Suchbereich von Selektor-Geschwistern muss die Elemente nach dem „vorherigen Element“ sein und Geschwisterelemente sein (d. h. sie haben dasselbe übergeordnete Element wie das „vorherige Element“).

Grammatik

// 这里的prev表示具体的选择器
// 这里的siblings表示具体的选择器
jQuery( "prev ~ siblings" )

Die Leerzeichen auf beiden Seiten des ~-Symbols können weggelassen werden, es wird jedoch nicht empfohlen, sie wegzulassen, da die Zeichen sonst möglicherweise zu nahe beieinander liegen, um die Lesbarkeit zu beeinträchtigen.

Parameter

Parameterbeschreibung

prev Ein gültiger Selektor.

Geschwister Ein gültiger Selektor.

Rückgabewert

Gibt ein jQuery-Objekt zurück, das die DOM-Elemente kapselt, die mit den Selektor-Geschwistern übereinstimmen und sich in den Geschwisterelementen nach dem „prev-Element“ befinden.

Wenn keine entsprechende Übereinstimmung gefunden wird, wird ein leeres jQuery-Objekt zurückgegeben.

Beispiel und Beschreibung

Nehmen Sie den folgenden HTML-Code als Beispiel:

<div id="n1">
    <p id="n2" class="test">
        <span id="n3" class="a">Hello</span>
        <span id="n4">Hello</span>
    </p>
    <p id="n5" class="detail">
        <span id="n6" class="b codeplayer">World
            <span id="n7" class="a">http://365mini.com</span>
            <span id="n8"></span>
            <span id="n9"></span>
        </span>
    </p>
</div>

Wenn wir nun das Peer-P-Tag nach dem P-Tag finden möchten, müssen wir kann den folgenden jQuery-Code schreiben:

// 选择了id为n5的一个元素
$("p ~ p");

Als nächstes finden wir das Geschwister-Span-Tag, das sich nach dem Span-Tag mit der ID n8 befindet, dann können wir den folgenden jQuery-Code schreiben:

// 选择了id为n9的一个元素
// n7虽然也是n8的同辈元素，但不在n8之后，而是之前，因此匹配不到
$("#n8 ~ span");

Suchen Sie das Span-Tag. Der entsprechende jQuery-Code für nachfolgende Peer-Span-Tags lautet wie folgt:

// 选择了id分别为n4、n8、n9的三个元素
// n9属于n7的~siblings，也是n8的~siblings，同一个元素只计入一次
$("span ~ span");

Das obige ist der detaillierte Inhalt vonDetaillierte Erklärung des jQuery-Selektors (vorherige ~ Geschwister). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!