Detailed explanation of the usage of jQuery.prevAll() function

The

prevAll() function is used to select all sibling elements before each matching element and return it in the form of a jQuery object.

You can also use selectors to further narrow the selection range and filter out elements that match the specified selector.

The opposite of this function is the nextAll() function, which is used to select all sibling elements after each matching element.

This function belongs to the jQuery object (instance).

Syntax

jQuery 1.2 Added this function.

jQueryObject.prevAll( [ selector ] )

Parameter

Parameter Description

selector Optional/String Type-specified selector String.

The prevAll() function will filter elements that match the specified selector among the sibling elements before each matching element in the current jQuery object.

If the selector parameter is omitted, all sibling elements before each matching element are selected.

Return value

prevAll()The return value of the function is jQuery type, returning a new jQuery object that encapsulates the current jQuery object before each matching element All sibling elements matching the specified selector.

If there is no element that meets the criteria, an empty jQuery object is returned.

Example & Description

Take the following HTML code as an example:

<p id="n1">
    <span id="n2">
        <span id="n3">A</span>
    </span>
    <strong id="n4" class="active">B</strong>
    <span id="n5" class="active">C</span>
    <label id="n6">D</label>
    <span id="n7">
        <span id="n8">E</span>
    </span>
</p>
<p id="n9">
    <span id="n10" class="active"></span>
    <label id="n11"></label>
    <span id="n12"></span>
</p>

The following jQuery sample code is used to demonstrate the specific usage of the prevAll() function:

//返回jQuery对象所有匹配元素的标识信息数组
//每个元素形如：#id
function getTagsInfo($doms){
    return $doms.map(function(){
        return "#" + this.id;
    }).get();
}
var $n6 = $("#n6");
//匹配n6之前所有的同辈元素
var $n6_prevAll = $n6.prevAll();
document.writeln( getTagsInfo( $n6_prevAll ) ); // #n5,#n4,#n2
//匹配n6之前的所有同辈strong元素
var $n6_prevAll_strong = $n6.prevAll("strong");
document.writeln( getTagsInfo( $n6_prevAll_strong ) ); // #n4
var $label = $("label");
//匹配所有label元素之前的包含类名"active"的同辈元素
var $label_prevAll_active = $label.prevAll(".active");
document.writeln( getTagsInfo( $label_prevAll_active ) ); // #n10,#n5,#n4

The above is the detailed content of Detailed explanation of the usage of jQuery.prevAll() function. For more information, please follow other related articles on the PHP Chinese website!