jquery nextUntil() method
Translation results:
next
#英[nekst] 美[nɛkst]
adj. Immediately after; second to; close to; immediately adjacent
adv.Go on;then;behind;sequentially
n.next;next one
prep.Close;behind;next door to…
until
UK[ənˈtɪl] US[ʌnˈtɪl]
prep.Until...;before...
conj.To... Until, before...; until...
jquery nextUntil() methodsyntax
Function: nextUntil() Gets all following sibling elements of each element, but does not include elements matched by selectors, DOM nodes, or passed jQuery objects.
Syntax 1: .nextUntil(selector,filter)
Parameters:
Parameters | Description |
selector | String value containing a selector expression indicating where to stop matching following sibling elements Mode. |
filter | String value containing the selector expression used to match the element. |
Syntax 2: .nextUntil(element,filter)
Parameters:
Parameters | Description |
element | Indicates where to stop matching following sibling elements DOM node or jQuery object. |
filter | String value containing the selector expression used to match elements. |
Description: Given a jQuery object that represents a collection of DOM elements, the .nextUntil() method allows us to search the DOM tree for elements following For sibling elements, the search will stop when an element matched by the parameters of this method is encountered. The new jQuery object returned contains all following sibling elements, but does not contain the element matched by the parameter. If the selector does not match or no selector is specified, all following siblings will be selected; if no selector is provided for filtering, the elements selected by this method are the same as the .nextAll() method. As of jQuery 1.6, a DOM node or jQuery object, instead of a selector, can be passed to the .nextUntil() method. This method accepts an optional selector expression as its second parameter. If this parameter is specified, elements will be filtered by detecting whether they match this selector.
jquery nextUntil() methodexample
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script> </head> <body> <dl> <dt id="term-1">term 1</dt> <dd>definition 1-a</dd> <dd>definition 1-b</dd> <dd>definition 1-c</dd> <dd>definition 1-d</dd> <dt id="term-2">term 2</dt> <dd>definition 2-a</dd> <dd>definition 2-b</dd> <dd>definition 2-c</dd> <dt id="term-3">term 3</dt> <dd>definition 3-a</dd> <dd>definition 3-b</dd> </dl> <script> $("#term-2").nextUntil("dt").css("background-color", "red"); var term3 = document.getElementById("term-3"); $("#term-1").nextUntil(term3, "dd").css("color", "blue"); </script> </body> </html>
Click the "Run instance" button to view the online instance