Grundlegende Einführung und detaillierte Erläuterung der Verwendung des prev + next-Selektors in jQuery

jQuerys prev + next-Selektor wird verwendet, um das nächste Geschwisterelement abzugleichen, das unmittelbar auf das prev-Element folgt, und es als jQuery zu kapseln Objekt und zurückgeben.

Hinweis: Der Suchbereich des Selektors next muss das nächste Element neben dem „vorherigen Element“ sein und ein Geschwisterelement des „vorherigen Elements“ sein.

Grammatik

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

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.

next Ein gültiger Selektor.

Rückgabewert

Gibt ein jQuery-Objekt zurück, das das DOM-Element kapselt, das dem nächsten Selektor im nächsten Geschwisterelement entspricht, das unmittelbar an das „vorherige Element“ angrenzt.

Obwohl es höchstens ein nächstes Geschwisterelement direkt neben einem „vorherigen Element“ gibt, kann es mehrere „vorherige Elemente“ geben, sodass es mehrere übereinstimmende DOM-Elemente geben kann, und sie sind alle in gekapselt zurückgegebenes jQuery-Objekt.

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>

Jetzt möchten wir das nächste Geschwister-p-Tag neben dem p-Tag finden. Sie können den folgenden jQuery-Code schreiben:

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

Wenn wir dann das nächste Geschwister-Span-Tag neben dem Span-Tag finden, können Sie den folgenden jQuery-Code schreiben:

// 选择了id分别为n4、n8、n9的三个元素
// n4是n3的next，n8是n7的next，n9是n8的next
$("span + span");

Suchen Sie nach dem nächsten Geschwister-Span-Tag neben dem Span-Tag, das den Klassennamen a enthält. Der entsprechende jQuery-Code lautet wie folgt:

// 选择了id分别为n4、n8的两个元素
// n8没有包含类名a，因此无法匹配其next——n9
$("span.a + span");

Suchen Sie nach dem nächsten Geschwister-Span-Tag neben dem P-Tag, dem entsprechenden jQuery-Code lautet wie folgt:

// 返回一个空的jQuery对象
// HTML中虽然有span标签，但不是p标签的同辈元素，而是其子代或后代
$("p + span");

Das obige ist der detaillierte Inhalt vonGrundlegende Einführung und detaillierte Erläuterung der Verwendung des prev + next-Selektors in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!