[jQuery] Re: Next/Previous element in each loop
You're right. And apparently it's still faster to get the element by
the array index and re-wrap it in a jQuery object than to use eq().
Some room for improvement in the core there.
cheers,
- ricardo
On Feb 9, 8:23 pm, mkmanning wrote:
> And just a final note on performance, as Stephan points out, the for
> loop is faster than $.each, likewise accessing the elements by array
> index is quite a bit (~7x) faster than using eq() --
>
> For 5 p elements (average time):
>
> Using .eq(): 0.14ms and 20 calls
>
> Using array index: 0.02ms 2 calls/4 calls (2 on the first & last)
>
> Depending upon how many elements you may be operating on, the time
> difference could become important.
>
> On Feb 9, 1:51 pm, mkmanning wrote:
>
> > Silently for text(), but it returns null for html() (using Adrian's
> > second example/my example) so you'll most likely want to check for
> > that.
>
> > On Feb 9, 1:23 pm, Ricardo Tomasi wrote:
>
> > > You can take advantage of the index passed to each. What you posted is
> > > very close to working:
>
> > > $(function() {
> > > var divs = $("div");
> > > divs.each(function(i){
>
> > > var prev = divs.eq(i-1).text();
> > > var next = divs.eq(i+1).text();
>
> > > alert(prev + " - " + next);
> > > });
>
> > > });
>
> > > There's no need to check for the existance of a previous/next element,
> > > as jQuery fails silently.
>
> > > cheers,
> > > - ricardo
>
> > > On Feb 9, 5:25 pm, Stephan Veigl wrote:
>
> > > > Hi Adrian,
>
> > > > as mkmanning already said, when you want to get the next / prev
> > > > element from the same selector, simply access the array.
> > > > In this case I prefer a for (var i=0; i > > > instead of the $.each for performance reasons and readability, but
> > > > that's personal taste.
>
> > > > by(e) :-)
> > > > Stephan
>
> > > > 2009/2/9 mkmanning :
>
> > > > > $("p") is an array, so you could just use the index:
>
> > > > > var ps = $("p"); //cache
> > > > > ps.each(function(i,d) {
> > > > > var prevP = i>0?$(ps[i-1]):false; /* however you want to deal
> > > > > with
> > > > > there not being a prev */
> > > > > var nextP = i > > > > want to
> > > > > deal with there not being a next */
> > > > > if(prevP){
> > > > > console.log($(prevP).html());
> > > > > }
> > > > > if(nextP){
> > > > > console.log($(nextP).html());
> > > > > }
> > > > > //if you only want p's that have a prev AND next, you can do
> > > > > this
> > > > > if(i>0 && i > > > > console.log( $(ps[i-1]).html() + ', ' +
> > > > > $(ps[i+1]).html() );
> > > > > }
> > > > > });
>
> > > > > On Feb 9, 8:55 am, Adrian Lynch wrote:
> > > > >> This explains better what I'm after:
>
> > > > >> $("p").each(function(i) {
> > > > >> var prevP = $(this).parent().prev().children("p");
> > > > >> var nextP = $(this).parent().next().children("p");
> > > > >> console.info(prevP.html());
> > > > >> console.info(nextP.html());
>
> > > > >> });
>
> > > > >>
> > > > >> 1
> > > > >>
> > > > >> This is next
> > > > >>
> > > > >>
> > > > >>
> > > > >>
> > > > >> This is previous
> > > > >>
> > > > >> 2
> > > > >>
> > > > >>
> > > > >> 3
> > > > >>
>
> > > > >> I want to refer to the next p in the each() loop but $(this).next()/
> > > > >> prev() refers to the next sibling element in the DOM.
>
> > > > >> So in the example above I'm having to go out to the parent, then get
> > > > >> the next/previous, then come in to get the p I want.
>
> > > > >> Now I'm wondering if there's a generic way to do this...
>
> > > > >> By(e) <-<< see!
> > > > >> Adrian
>
> > > > >> On Feb 9, 4:44 pm, Adrian Lynch wrote:
>
> > > > >> > That's what I was hoping for, but next() and prev() act on the next
> > > > >> > and previous elements in the DOM, not in the nodes you're looping
> > > > >> > over. To demonstrate:
>
> > > > >> > $("p").each(function(i) {
> > > > >> > console.info($(this).next().html());
> > > > >> > console.info($(this).prev().html());
>
> > > > >> > });
>
> > > > >> >
> > > > >> >
> > > > >> > 1
> > > > >> >
> > > > >> > This is next
> > > > >> >
> > > > >> >
> > > > >> >
> > > > >> >
> > > > >> > This is previous
> > > > >> >
> > > > >> > 2
> > > > >> >
> > > > >> >
> > > > >> > 3
> > > > >> >
> > > > >> >
>
> > > > >> > Maybe I have to come out to the outer most divs before calling
> > > > >> > next()/
> > > > >> > prev() on it.
>
> > > > >> > Adrian
>
> > > > >> > On Feb 4, 4:16 pm, Stephan Veigl wrote:
>
> > > > >> > > Hi,
>
> > > > >> > > there are prev() and next() functions doing exactly what you
> > > > >> >
[jQuery] Re: Next/Previous element in each loop
And just a final note on performance, as Stephan points out, the for
loop is faster than $.each, likewise accessing the elements by array
index is quite a bit (~7x) faster than using eq() --
For 5 p elements (average time):
Using .eq(): 0.14ms and 20 calls
Using array index: 0.02ms 2 calls/4 calls (2 on the first & last)
Depending upon how many elements you may be operating on, the time
difference could become important.
On Feb 9, 1:51 pm, mkmanning wrote:
> Silently for text(), but it returns null for html() (using Adrian's
> second example/my example) so you'll most likely want to check for
> that.
>
> On Feb 9, 1:23 pm, Ricardo Tomasi wrote:
>
> > You can take advantage of the index passed to each. What you posted is
> > very close to working:
>
> > $(function() {
> > var divs = $("div");
> > divs.each(function(i){
>
> > var prev = divs.eq(i-1).text();
> > var next = divs.eq(i+1).text();
>
> > alert(prev + " - " + next);
> > });
>
> > });
>
> > There's no need to check for the existance of a previous/next element,
> > as jQuery fails silently.
>
> > cheers,
> > - ricardo
>
> > On Feb 9, 5:25 pm, Stephan Veigl wrote:
>
> > > Hi Adrian,
>
> > > as mkmanning already said, when you want to get the next / prev
> > > element from the same selector, simply access the array.
> > > In this case I prefer a for (var i=0; i > > instead of the $.each for performance reasons and readability, but
> > > that's personal taste.
>
> > > by(e) :-)
> > > Stephan
>
> > > 2009/2/9 mkmanning :
>
> > > > $("p") is an array, so you could just use the index:
>
> > > > var ps = $("p"); //cache
> > > > ps.each(function(i,d) {
> > > > var prevP = i>0?$(ps[i-1]):false; /* however you want to deal
> > > > with
> > > > there not being a prev */
> > > > var nextP = i > > > to
> > > > deal with there not being a next */
> > > > if(prevP){
> > > > console.log($(prevP).html());
> > > > }
> > > > if(nextP){
> > > > console.log($(nextP).html());
> > > > }
> > > > //if you only want p's that have a prev AND next, you can do this
> > > > if(i>0 && i > > > console.log( $(ps[i-1]).html() + ', ' +
> > > > $(ps[i+1]).html() );
> > > > }
> > > > });
>
> > > > On Feb 9, 8:55 am, Adrian Lynch wrote:
> > > >> This explains better what I'm after:
>
> > > >> $("p").each(function(i) {
> > > >> var prevP = $(this).parent().prev().children("p");
> > > >> var nextP = $(this).parent().next().children("p");
> > > >> console.info(prevP.html());
> > > >> console.info(nextP.html());
>
> > > >> });
>
> > > >>
> > > >> 1
> > > >>
> > > >> This is next
> > > >>
> > > >>
> > > >>
> > > >>
> > > >> This is previous
> > > >>
> > > >> 2
> > > >>
> > > >>
> > > >> 3
> > > >>
>
> > > >> I want to refer to the next p in the each() loop but $(this).next()/
> > > >> prev() refers to the next sibling element in the DOM.
>
> > > >> So in the example above I'm having to go out to the parent, then get
> > > >> the next/previous, then come in to get the p I want.
>
> > > >> Now I'm wondering if there's a generic way to do this...
>
> > > >> By(e) <-<< see!
> > > >> Adrian
>
> > > >> On Feb 9, 4:44 pm, Adrian Lynch wrote:
>
> > > >> > That's what I was hoping for, but next() and prev() act on the next
> > > >> > and previous elements in the DOM, not in the nodes you're looping
> > > >> > over. To demonstrate:
>
> > > >> > $("p").each(function(i) {
> > > >> > console.info($(this).next().html());
> > > >> > console.info($(this).prev().html());
>
> > > >> > });
>
> > > >> >
> > > >> >
> > > >> > 1
> > > >> >
> > > >> > This is next
> > > >> >
> > > >> >
> > > >> >
> > > >> >
> > > >> > This is previous
> > > >> >
> > > >> > 2
> > > >> >
> > > >> >
> > > >> > 3
> > > >> >
> > > >> >
>
> > > >> > Maybe I have to come out to the outer most divs before calling
> > > >> > next()/
> > > >> > prev() on it.
>
> > > >> > Adrian
>
> > > >> > On Feb 4, 4:16 pm, Stephan Veigl wrote:
>
> > > >> > > Hi,
>
> > > >> > > there are prev() and next() functions doing exactly what you need:
>
> > > >> > > $("div").each( function() {
> > > >> > > var prev = $(this).prev();
> > > >> > > var next = $(this).next();
> > > >> > > alert( prev.text() + "-" + next.text() );
>
> > > >> > > });
>
> > > >> > > (I've skipped the extra code for the first and last element for
> > > >> > > simplicity.)
>
> > > >> > > by(e)
> > > >> > > Stephan
>
> > > >> > > 2009/2/4AdrianLynch:
>
> > > >> > > > Hey all, I'm loop over some nodes witheach() and I need to look
> > > >> > > > at
> > > >> > > > the next
[jQuery] Re: Next/Previous element in each loop
Silently for text(), but it returns null for html() (using Adrian's
second example/my example) so you'll most likely want to check for
that.
On Feb 9, 1:23 pm, Ricardo Tomasi wrote:
> You can take advantage of the index passed to each. What you posted is
> very close to working:
>
> $(function() {
> var divs = $("div");
> divs.each(function(i){
>
> var prev = divs.eq(i-1).text();
> var next = divs.eq(i+1).text();
>
> alert(prev + " - " + next);
> });
>
> });
>
> There's no need to check for the existance of a previous/next element,
> as jQuery fails silently.
>
> cheers,
> - ricardo
>
> On Feb 9, 5:25 pm, Stephan Veigl wrote:
>
> > Hi Adrian,
>
> > as mkmanning already said, when you want to get the next / prev
> > element from the same selector, simply access the array.
> > In this case I prefer a for (var i=0; i > instead of the $.each for performance reasons and readability, but
> > that's personal taste.
>
> > by(e) :-)
> > Stephan
>
> > 2009/2/9 mkmanning :
>
> > > $("p") is an array, so you could just use the index:
>
> > > var ps = $("p"); //cache
> > > ps.each(function(i,d) {
> > > var prevP = i>0?$(ps[i-1]):false; /* however you want to deal with
> > > there not being a prev */
> > > var nextP = i > > deal with there not being a next */
> > > if(prevP){
> > > console.log($(prevP).html());
> > > }
> > > if(nextP){
> > > console.log($(nextP).html());
> > > }
> > > //if you only want p's that have a prev AND next, you can do this
> > > if(i>0 && i > > console.log( $(ps[i-1]).html() + ', ' + $(ps[i+1]).html()
> > > );
> > > }
> > > });
>
> > > On Feb 9, 8:55 am, Adrian Lynch wrote:
> > >> This explains better what I'm after:
>
> > >> $("p").each(function(i) {
> > >> var prevP = $(this).parent().prev().children("p");
> > >> var nextP = $(this).parent().next().children("p");
> > >> console.info(prevP.html());
> > >> console.info(nextP.html());
>
> > >> });
>
> > >>
> > >> 1
> > >>
> > >> This is next
> > >>
> > >>
> > >>
> > >>
> > >> This is previous
> > >>
> > >> 2
> > >>
> > >>
> > >> 3
> > >>
>
> > >> I want to refer to the next p in the each() loop but $(this).next()/
> > >> prev() refers to the next sibling element in the DOM.
>
> > >> So in the example above I'm having to go out to the parent, then get
> > >> the next/previous, then come in to get the p I want.
>
> > >> Now I'm wondering if there's a generic way to do this...
>
> > >> By(e) <-<< see!
> > >> Adrian
>
> > >> On Feb 9, 4:44 pm, Adrian Lynch wrote:
>
> > >> > That's what I was hoping for, but next() and prev() act on the next
> > >> > and previous elements in the DOM, not in the nodes you're looping
> > >> > over. To demonstrate:
>
> > >> > $("p").each(function(i) {
> > >> > console.info($(this).next().html());
> > >> > console.info($(this).prev().html());
>
> > >> > });
>
> > >> >
> > >> >
> > >> > 1
> > >> >
> > >> > This is next
> > >> >
> > >> >
> > >> >
> > >> >
> > >> > This is previous
> > >> >
> > >> > 2
> > >> >
> > >> >
> > >> > 3
> > >> >
> > >> >
>
> > >> > Maybe I have to come out to the outer most divs before calling next()/
> > >> > prev() on it.
>
> > >> > Adrian
>
> > >> > On Feb 4, 4:16 pm, Stephan Veigl wrote:
>
> > >> > > Hi,
>
> > >> > > there are prev() and next() functions doing exactly what you need:
>
> > >> > > $("div").each( function() {
> > >> > > var prev = $(this).prev();
> > >> > > var next = $(this).next();
> > >> > > alert( prev.text() + "-" + next.text() );
>
> > >> > > });
>
> > >> > > (I've skipped the extra code for the first and last element for
> > >> > > simplicity.)
>
> > >> > > by(e)
> > >> > > Stephan
>
> > >> > > 2009/2/4AdrianLynch:
>
> > >> > > > Hey all, I'm loop over some nodes witheach() and I need to look at
> > >> > > > the next and previous elements for the current iteration.
>
> > >> > > >
> > >> > > > $(function() {
> > >> > > > $("div").each(function(i) {
> > >> > > > var prev = [SELECTOR FOR PREVIOUS
> > >> > > > DIV].text();
> > >> > > > var next = [SELECTOR FOR NEXT DIV].text();
> > >> > > > alert(prev + " : " + next);
> > >> > > > });
> > >> > > > });
> > >> > > >
>
> > >> > > > 1
> > >> > > > 2
> > >> > > > 3
>
> > >> > > > Will I have to store a reference to the divs and access it with i
> > >> > > > in
> > >> > > > the loop like this:
>
> > >> > > >
> > >> > > > $(function() {
>
> > >> > > > var divs = $("div");
>
> > >> >
[jQuery] Re: Next/Previous element in each loop
You can take advantage of the index passed to each. What you posted is
very close to working:
$(function() {
var divs = $("div");
divs.each(function(i){
var prev = divs.eq(i-1).text();
var next = divs.eq(i+1).text();
alert(prev + " - " + next);
});
});
There's no need to check for the existance of a previous/next element,
as jQuery fails silently.
cheers,
- ricardo
On Feb 9, 5:25 pm, Stephan Veigl wrote:
> Hi Adrian,
>
> as mkmanning already said, when you want to get the next / prev
> element from the same selector, simply access the array.
> In this case I prefer a for (var i=0; i instead of the $.each for performance reasons and readability, but
> that's personal taste.
>
> by(e) :-)
> Stephan
>
> 2009/2/9 mkmanning :
>
>
>
> > $("p") is an array, so you could just use the index:
>
> > var ps = $("p"); //cache
> > ps.each(function(i,d) {
> > var prevP = i>0?$(ps[i-1]):false; /* however you want to deal with
> > there not being a prev */
> > var nextP = i > deal with there not being a next */
> > if(prevP){
> > console.log($(prevP).html());
> > }
> > if(nextP){
> > console.log($(nextP).html());
> > }
> > //if you only want p's that have a prev AND next, you can do this
> > if(i>0 && i > console.log( $(ps[i-1]).html() + ', ' + $(ps[i+1]).html() );
> > }
> > });
>
> > On Feb 9, 8:55 am, Adrian Lynch wrote:
> >> This explains better what I'm after:
>
> >> $("p").each(function(i) {
> >> var prevP = $(this).parent().prev().children("p");
> >> var nextP = $(this).parent().next().children("p");
> >> console.info(prevP.html());
> >> console.info(nextP.html());
>
> >> });
>
> >>
> >> 1
> >>
> >> This is next
> >>
> >>
> >>
> >>
> >> This is previous
> >>
> >> 2
> >>
> >>
> >> 3
> >>
>
> >> I want to refer to the next p in the each() loop but $(this).next()/
> >> prev() refers to the next sibling element in the DOM.
>
> >> So in the example above I'm having to go out to the parent, then get
> >> the next/previous, then come in to get the p I want.
>
> >> Now I'm wondering if there's a generic way to do this...
>
> >> By(e) <-<< see!
> >> Adrian
>
> >> On Feb 9, 4:44 pm, Adrian Lynch wrote:
>
> >> > That's what I was hoping for, but next() and prev() act on the next
> >> > and previous elements in the DOM, not in the nodes you're looping
> >> > over. To demonstrate:
>
> >> > $("p").each(function(i) {
> >> > console.info($(this).next().html());
> >> > console.info($(this).prev().html());
>
> >> > });
>
> >> >
> >> >
> >> > 1
> >> >
> >> > This is next
> >> >
> >> >
> >> >
> >> >
> >> > This is previous
> >> >
> >> > 2
> >> >
> >> >
> >> > 3
> >> >
> >> >
>
> >> > Maybe I have to come out to the outer most divs before calling next()/
> >> > prev() on it.
>
> >> > Adrian
>
> >> > On Feb 4, 4:16 pm, Stephan Veigl wrote:
>
> >> > > Hi,
>
> >> > > there are prev() and next() functions doing exactly what you need:
>
> >> > > $("div").each( function() {
> >> > > var prev = $(this).prev();
> >> > > var next = $(this).next();
> >> > > alert( prev.text() + "-" + next.text() );
>
> >> > > });
>
> >> > > (I've skipped the extra code for the first and last element for
> >> > > simplicity.)
>
> >> > > by(e)
> >> > > Stephan
>
> >> > > 2009/2/4AdrianLynch:
>
> >> > > > Hey all, I'm loop over some nodes witheach() and I need to look at
> >> > > > the next and previous elements for the current iteration.
>
> >> > > >
> >> > > > $(function() {
> >> > > > $("div").each(function(i) {
> >> > > > var prev = [SELECTOR FOR PREVIOUS DIV].text();
> >> > > > var next = [SELECTOR FOR NEXT DIV].text();
> >> > > > alert(prev + " : " + next);
> >> > > > });
> >> > > > });
> >> > > >
>
> >> > > > 1
> >> > > > 2
> >> > > > 3
>
> >> > > > Will I have to store a reference to the divs and access it with i in
> >> > > > the loop like this:
>
> >> > > >
> >> > > > $(function() {
>
> >> > > > var divs = $("div");
>
> >> > > > divs.each(function(i) {
>
> >> > > > var prev = "";
> >> > > > var next = "";
>
> >> > > > if (i > 0)
> >> > > > prev = $(divs.get(i - 1)).text();
>
> >> > > > if (i < divs.size() - 1)
> >> > > > next = $(divs.get(i + 1)).text();
>
> >> > > > alert(prev + " - " + next);
>
> >> > > >
[jQuery] Re: Next/Previous element in each loop
Hi Adrian,
as mkmanning already said, when you want to get the next / prev
element from the same selector, simply access the array.
In this case I prefer a for (var i=0; i:
>
> $("p") is an array, so you could just use the index:
>
> var ps = $("p"); //cache
> ps.each(function(i,d) {
>var prevP = i>0?$(ps[i-1]):false; /* however you want to deal with
> there not being a prev */
>var nextP = i deal with there not being a next */
>if(prevP){
>console.log($(prevP).html());
>}
>if(nextP){
>console.log($(nextP).html());
>}
>//if you only want p's that have a prev AND next, you can do this
>if(i>0 && iconsole.log( $(ps[i-1]).html() + ', ' + $(ps[i+1]).html() );
>}
> });
>
>
> On Feb 9, 8:55 am, Adrian Lynch wrote:
>> This explains better what I'm after:
>>
>> $("p").each(function(i) {
>> var prevP = $(this).parent().prev().children("p");
>> var nextP = $(this).parent().next().children("p");
>> console.info(prevP.html());
>> console.info(nextP.html());
>>
>> });
>>
>>
>> 1
>>
>> This is next
>>
>>
>>
>>
>> This is previous
>>
>> 2
>>
>>
>> 3
>>
>>
>> I want to refer to the next p in the each() loop but $(this).next()/
>> prev() refers to the next sibling element in the DOM.
>>
>> So in the example above I'm having to go out to the parent, then get
>> the next/previous, then come in to get the p I want.
>>
>> Now I'm wondering if there's a generic way to do this...
>>
>> By(e) <-<< see!
>> Adrian
>>
>> On Feb 9, 4:44 pm, Adrian Lynch wrote:
>>
>> > That's what I was hoping for, but next() and prev() act on the next
>> > and previous elements in the DOM, not in the nodes you're looping
>> > over. To demonstrate:
>>
>> > $("p").each(function(i) {
>> > console.info($(this).next().html());
>> > console.info($(this).prev().html());
>>
>> > });
>>
>> >
>> >
>> > 1
>> >
>> > This is next
>> >
>> >
>> >
>> >
>> > This is previous
>> >
>> > 2
>> >
>> >
>> > 3
>> >
>> >
>>
>> > Maybe I have to come out to the outer most divs before calling next()/
>> > prev() on it.
>>
>> > Adrian
>>
>> > On Feb 4, 4:16 pm, Stephan Veigl wrote:
>>
>> > > Hi,
>>
>> > > there are prev() and next() functions doing exactly what you need:
>>
>> > > $("div").each( function() {
>> > > var prev = $(this).prev();
>> > > var next = $(this).next();
>> > > alert( prev.text() + "-" + next.text() );
>>
>> > > });
>>
>> > > (I've skipped the extra code for the first and last element for
>> > > simplicity.)
>>
>> > > by(e)
>> > > Stephan
>>
>> > > 2009/2/4AdrianLynch:
>>
>> > > > Hey all, I'm loop over some nodes witheach() and I need to look at
>> > > > the next and previous elements for the current iteration.
>>
>> > > >
>> > > >$(function() {
>> > > >$("div").each(function(i) {
>> > > >var prev = [SELECTOR FOR PREVIOUS DIV].text();
>> > > >var next = [SELECTOR FOR NEXT DIV].text();
>> > > >alert(prev + " : " + next);
>> > > >});
>> > > >});
>> > > >
>>
>> > > > 1
>> > > > 2
>> > > > 3
>>
>> > > > Will I have to store a reference to the divs and access it with i in
>> > > > the loop like this:
>>
>> > > >
>> > > >$(function() {
>>
>> > > >var divs = $("div");
>>
>> > > >divs.each(function(i) {
>>
>> > > >var prev = "";
>> > > >var next = "";
>>
>> > > >if (i > 0)
>> > > >prev = $(divs.get(i - 1)).text();
>>
>> > > >if (i < divs.size() - 1)
>> > > >next = $(divs.get(i + 1)).text();
>>
>> > > >alert(prev + " - " + next);
>>
>> > > >});
>> > > >});
>> > > >
>>
>> > > > 1
>> > > > Spanner in the works
>> > > > 2
>> > > > Don't select me!
>> > > > 3
>>
>> > > > Is next() the answer maybe?
[jQuery] Re: Next/Previous element in each loop
$("p") is an array, so you could just use the index:
var ps = $("p"); //cache
ps.each(function(i,d) {
var prevP = i>0?$(ps[i-1]):false; /* however you want to deal with
there not being a prev */
var nextP = i0 && i wrote:
> This explains better what I'm after:
>
> $("p").each(function(i) {
> var prevP = $(this).parent().prev().children("p");
> var nextP = $(this).parent().next().children("p");
> console.info(prevP.html());
> console.info(nextP.html());
>
> });
>
>
> 1
>
> This is next
>
>
>
>
> This is previous
>
> 2
>
>
> 3
>
>
> I want to refer to the next p in the each() loop but $(this).next()/
> prev() refers to the next sibling element in the DOM.
>
> So in the example above I'm having to go out to the parent, then get
> the next/previous, then come in to get the p I want.
>
> Now I'm wondering if there's a generic way to do this...
>
> By(e) <-<< see!
> Adrian
>
> On Feb 9, 4:44 pm, Adrian Lynch wrote:
>
> > That's what I was hoping for, but next() and prev() act on the next
> > and previous elements in the DOM, not in the nodes you're looping
> > over. To demonstrate:
>
> > $("p").each(function(i) {
> > console.info($(this).next().html());
> > console.info($(this).prev().html());
>
> > });
>
> >
> >
> > 1
> >
> > This is next
> >
> >
> >
> >
> > This is previous
> >
> > 2
> >
> >
> > 3
> >
> >
>
> > Maybe I have to come out to the outer most divs before calling next()/
> > prev() on it.
>
> > Adrian
>
> > On Feb 4, 4:16 pm, Stephan Veigl wrote:
>
> > > Hi,
>
> > > there are prev() and next() functions doing exactly what you need:
>
> > > $("div").each( function() {
> > > var prev = $(this).prev();
> > > var next = $(this).next();
> > > alert( prev.text() + "-" + next.text() );
>
> > > });
>
> > > (I've skipped the extra code for the first and last element for
> > > simplicity.)
>
> > > by(e)
> > > Stephan
>
> > > 2009/2/4AdrianLynch:
>
> > > > Hey all, I'm loop over some nodes witheach() and I need to look at
> > > > the next and previous elements for the current iteration.
>
> > > >
> > > > $(function() {
> > > > $("div").each(function(i) {
> > > > var prev = [SELECTOR FOR PREVIOUS DIV].text();
> > > > var next = [SELECTOR FOR NEXT DIV].text();
> > > > alert(prev + " : " + next);
> > > > });
> > > > });
> > > >
>
> > > > 1
> > > > 2
> > > > 3
>
> > > > Will I have to store a reference to the divs and access it with i in
> > > > the loop like this:
>
> > > >
> > > > $(function() {
>
> > > > var divs = $("div");
>
> > > > divs.each(function(i) {
>
> > > > var prev = "";
> > > > var next = "";
>
> > > > if (i > 0)
> > > > prev = $(divs.get(i - 1)).text();
>
> > > > if (i < divs.size() - 1)
> > > > next = $(divs.get(i + 1)).text();
>
> > > > alert(prev + " - " + next);
>
> > > > });
> > > > });
> > > >
>
> > > > 1
> > > > Spanner in the works
> > > > 2
> > > > Don't select me!
> > > > 3
>
> > > > Is next() the answer maybe?
[jQuery] Re: Next/Previous element in each loop
This explains better what I'm after:
$("p").each(function(i) {
var prevP = $(this).parent().prev().children("p");
var nextP = $(this).parent().next().children("p");
console.info(prevP.html());
console.info(nextP.html());
});
1
This is next
This is previous
2
3
I want to refer to the next p in the each() loop but $(this).next()/
prev() refers to the next sibling element in the DOM.
So in the example above I'm having to go out to the parent, then get
the next/previous, then come in to get the p I want.
Now I'm wondering if there's a generic way to do this...
By(e) <-<< see!
Adrian
On Feb 9, 4:44 pm, Adrian Lynch wrote:
> That's what I was hoping for, but next() and prev() act on the next
> and previous elements in the DOM, not in the nodes you're looping
> over. To demonstrate:
>
> $("p").each(function(i) {
> console.info($(this).next().html());
> console.info($(this).prev().html());
>
> });
>
>
>
> 1
>
> This is next
>
>
>
>
> This is previous
>
> 2
>
>
> 3
>
>
>
> Maybe I have to come out to the outer most divs before calling next()/
> prev() on it.
>
> Adrian
>
> On Feb 4, 4:16 pm, Stephan Veigl wrote:
>
> > Hi,
>
> > there are prev() and next() functions doing exactly what you need:
>
> > $("div").each( function() {
> > var prev = $(this).prev();
> > var next = $(this).next();
> > alert( prev.text() + "-" + next.text() );
>
> > });
>
> > (I've skipped the extra code for the first and last element for simplicity.)
>
> > by(e)
> > Stephan
>
> > 2009/2/4AdrianLynch:
>
> > > Hey all, I'm loop over some nodes witheach() and I need to look at
> > > the next and previous elements for the current iteration.
>
> > >
> > > $(function() {
> > > $("div").each(function(i) {
> > > var prev = [SELECTOR FOR PREVIOUS DIV].text();
> > > var next = [SELECTOR FOR NEXT DIV].text();
> > > alert(prev + " : " + next);
> > > });
> > > });
> > >
>
> > > 1
> > > 2
> > > 3
>
> > > Will I have to store a reference to the divs and access it with i in
> > > the loop like this:
>
> > >
> > > $(function() {
>
> > > var divs = $("div");
>
> > > divs.each(function(i) {
>
> > > var prev = "";
> > > var next = "";
>
> > > if (i > 0)
> > > prev = $(divs.get(i - 1)).text();
>
> > > if (i < divs.size() - 1)
> > > next = $(divs.get(i + 1)).text();
>
> > > alert(prev + " - " + next);
>
> > > });
> > > });
> > >
>
> > > 1
> > > Spanner in the works
> > > 2
> > > Don't select me!
> > > 3
>
> > > Is next() the answer maybe?
[jQuery] Re: Next/Previous element in each loop
That's what I was hoping for, but next() and prev() act on the next
and previous elements in the DOM, not in the nodes you're looping
over. To demonstrate:
$("p").each(function(i) {
console.info($(this).next().html());
console.info($(this).prev().html());
});
1
This is next
This is previous
2
3
Maybe I have to come out to the outer most divs before calling next()/
prev() on it.
Adrian
On Feb 4, 4:16 pm, Stephan Veigl wrote:
> Hi,
>
> there are prev() and next() functions doing exactly what you need:
>
> $("div").each( function() {
> var prev = $(this).prev();
> var next = $(this).next();
> alert( prev.text() + "-" + next.text() );
>
> });
>
> (I've skipped the extra code for the first and last element for simplicity.)
>
> by(e)
> Stephan
>
> 2009/2/4AdrianLynch:
>
>
>
> > Hey all, I'm loop over some nodes witheach() and I need to look at
> > the next and previous elements for the current iteration.
>
> >
> > $(function() {
> > $("div").each(function(i) {
> > var prev = [SELECTOR FOR PREVIOUS DIV].text();
> > var next = [SELECTOR FOR NEXT DIV].text();
> > alert(prev + " : " + next);
> > });
> > });
> >
>
> > 1
> > 2
> > 3
>
> > Will I have to store a reference to the divs and access it with i in
> > the loop like this:
>
> >
> > $(function() {
>
> > var divs = $("div");
>
> > divs.each(function(i) {
>
> > var prev = "";
> > var next = "";
>
> > if (i > 0)
> > prev = $(divs.get(i - 1)).text();
>
> > if (i < divs.size() - 1)
> > next = $(divs.get(i + 1)).text();
>
> > alert(prev + " - " + next);
>
> > });
> > });
> >
>
> > 1
> > Spanner in the works
> > 2
> > Don't select me!
> > 3
>
> > Is next() the answer maybe?
[jQuery] Re: Next/Previous element in each loop
Hi,
there are prev() and next() functions doing exactly what you need:
$("div").each( function() {
var prev = $(this).prev();
var next = $(this).next();
alert( prev.text() + "-" + next.text() );
});
(I've skipped the extra code for the first and last element for simplicity.)
by(e)
Stephan
2009/2/4 Adrian Lynch :
>
> Hey all, I'm loop over some nodes with each() and I need to look at
> the next and previous elements for the current iteration.
>
>
>$(function() {
>$("div").each(function(i) {
>var prev = [SELECTOR FOR PREVIOUS DIV].text();
>var next = [SELECTOR FOR NEXT DIV].text();
>alert(prev + " : " + next);
>});
>});
>
>
> 1
> 2
> 3
>
> Will I have to store a reference to the divs and access it with i in
> the loop like this:
>
>
>$(function() {
>
>var divs = $("div");
>
>divs.each(function(i) {
>
>var prev = "";
>var next = "";
>
>if (i > 0)
>prev = $(divs.get(i - 1)).text();
>
>if (i < divs.size() - 1)
>next = $(divs.get(i + 1)).text();
>
>alert(prev + " - " + next);
>
>});
>});
>
>
> 1
> Spanner in the works
> 2
> Don't select me!
> 3
>
> Is next() the answer maybe?
>
>
