2

I am having issues with getting exactly values with Javascript.

Following is working version of when we have class on single item. http://jsfiddle.net/rtnNd/

Actually when code block has more items with same class (see this: http://jsfiddle.net/rtnNd/3), it picks up only the first item which use the class name.

My issue is that I would like to pick up only the last item which use the class name. So I used following code: 

var item = $('.itemAnchor')[6]; 
var href = $($('.hidden_elem')[1].innerHTML.replace('<!--', '').replace('-->', '')).find(item).attr('href');

But it doesn't work though. I don't really know why.

The code that may contains items are using same class, class may be use in 2 items, 3 items, or 6th times. That's why, I want to pick up only the last item to extract.

Can you explain, thank you all for reading my question.

Marty
  • 39,033
  • 19
  • 93
  • 162
Hafizi Vilie
  • 37
  • 1
  • 7
  • If you try to feed the innerHTML into an XML parser you might find it easier to do this. – Waleed Khan Nov 21 '12 at 02:33
  • Thanks for suggestion, but I am very much newbie for XML parser. – Hafizi Vilie Nov 21 '12 at 02:38
  • Do not parse HTML with regexes. It is a *very bad idea*: http://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags – Waleed Khan Nov 21 '12 at 02:39
  • Yes, I see, thanks for that, I will avoid later as far as I can, and it makes me laugh. But I am seeking the answer that circumstance will take only for client-side and normal standard for now. For the record, I am an newbie :P – Hafizi Vilie Nov 21 '12 at 02:56

1 Answers1

2

"My issue is that I would like to pick up only the last item which use the class name."

OK, so in a general sense you would use the .last() method:

var lastItem = $('.itemAnchor').last();

Except that there are no elements in the DOM with that class because (in your fiddles) they're all commented out. This is also the reason why the code you showed in your question didn't work. The first line:

var item = $('.itemAnchor')[6];

...sets the item variable to undefined. The selector '.itemAnchor' returns no elements, so $('.itemAnchor') is an empty jQuery object and it has no element at index 6.

You need to use the '.itemAnchor' selector on the html that you get after removing the opening and closing comments with your .replace() statements, so:

var href = $($('.hidden_elem')[0].innerHTML.replace('<!--','').replace('-->',''))
          .find('.itemAnchor').last().attr('href');

Demo: http://jsfiddle.net/rtnNd/4/

EDIT in response to comment:

"How can we pick up the itemElement before that last one."

If you know you always want the second-last item use .slice(-2,-1) instead of .last(), as shown here: http://jsfiddle.net/rtnNd/5/

Or if you know you want whichever one has an href that contains a parameter h= then you can use a selector like '.itemAnchor[href*="h="]' with .find(), in which case you don't need .last() or .slice():

var href = $($('.hidden_elem')[0].innerHTML.replace('<!--','').replace('-->',''))
          .find('.itemAnchor[href*="h="]').attr('href');

Demo: http://jsfiddle.net/rtnNd/6/

Note though that this last method using the attribute-contains selector is picking up elements where the href has the text "h=" anywhere, so it works for your case but would also pick up hh=something or math=easy or whatever. You could avoid this and test for just h= as follows:

var href = $($('.hidden_elem')[0].innerHTML.replace('<!--','').replace('-->',''))
    .find('.itemAnchor')
    .filter(function() {
        return /(\?|&)h=/.test(this.href);
    }).attr('href');

Demo: http://jsfiddle.net/rtnNd/7/

nnnnnn
  • 147,572
  • 30
  • 200
  • 241
  • Thanks, it works! How can we pick up the itemElement before that last one. I want to extract the href="/ajax/report/social.php?content_type=0&....", i think, we can't use last() for it. right? – Hafizi Vilie Nov 21 '12 at 03:18
  • nnnnn : I would like to get your hand for final, this will be last question, thank you very much for my non-profit community project. – Hafizi Vilie Nov 23 '12 at 04:19
  • [link](http://stackoverflow.com/questions/13521211/callback-behavior-of-javascript-object-error-after-xmlhttprequest-onreadystatech) please nnnnnn can you help me for this? thank you very much. – Hafizi Vilie Nov 24 '12 at 01:48