jQuery - Get an element in the parent

aidan_walsh · 28-05-2009 11:30AM #1

Hey guys,

I have been messing around with jQuery for the first time and have hit upon a snag.

I have a list structured like this.

[HTML]
<ul><li>
<h3><a href="some.where">Title</a></h3>
Some other data stuff goes in here.
<a href="some.where.else" class="rate">Rate them</a>
</li></ul>
[/HTML]

What I am trying to go is grab the Title from the first link. Ideally, I'd like to do this in a way that can be seperated out to other information that may be in the list item as well.

I can get it to grab all the information using $(this).parent().html(), but as soon as I start using $(this).parent().get(index).html() it starts failing on me. Can't for the life of me see what the problem is though.

Any ideas?

Liam Byrne · 28-05-2009 11:36AM

I'm assuming you're triggering this from the 2nd link ?

If so :

$(this).parent().find("h3 a").html()

or

$(this).parent().find("a:first").html()

....should do the trick for you.

should do the trick for you.

Liam Byrne · 28-05-2009 11:39AM

Actually, even $(this).parent().find("h3").text() will work (.text dumps any HTML tags).

Not sure which of the above 3 would be best, performance-wise......but that's only an issue if there are lots of links of the class "rate".

aidan_walsh · 28-05-2009 11:53AM

Sorted, cheers Liam.

The .find("h3 a") was perfect.

kevteljeur · 28-05-2009 12:32PM

Liam Byrne wrote: »

Actually, even $(this).parent().find("h3").text() will work (.text dumps any HTML tags).

Not sure which of the above 3 would be best, performance-wise......but that's only an issue if there are lots of links of the class "rate".

I think the performance issue is probably moot if you're using the very latest version of JQuery; they've been trumpeting the performance of their new selector engine...

.

Liam Byrne · 28-05-2009 12:47PM

kevteljeur wrote: »

I think the performance issue is probably moot if you're using the very latest version of JQuery; they've been trumpeting the performance of their new selector engine...

.

No matter how good the performance of something is, if you give it more work to do it'll be slower.

But like I said, unless you have absolutely LOADS of "rate" links, the difference would be negligible...it would really only come into play if you talking about cumulative effect of a number of "handy-but-unoptimised" DOM calls.

ok, so - I'll admit it....I was just showing off that I could find 3 ways and was aware that there were performance implications with different approaches! :P

mewso · 28-05-2009 06:10PM

The biggest issue performance wise I think with jQuery is not to use the same selector repeatedly. Instead use the each function. i.e. don't do this:-

$(selector).html("blah");
$(selector).addClass("myclass");

do this:-

$(selector).each(function() {
$(this).html("blah");
$(this).addClass("myclass");
});

As far as I am aware the second way will be more efficient but I'm open to correction.

jQuery - Get an element in the parent

Comments