CODEWITHSUNDEEP
jqueryimdb
user9178946
user9178946

Reputation:

How to dynamically grab a segment of an on-page URL with jQuery?

Users can leave comments on any page, and paste in any IMDb link.

I'm already grabbing and manipulating those links like so:

jQuery('[href*="imdb.com/title"]').addClass('imdb-link').after(' <span class="imdbRatingPlugin" data-title="" data-style="p4"><img src="logo.png" alt="IMDb" style="max-height:16px" /> </span>');

Now, the missing piece I've been struggling with is how to copy the IMDb movie title id over to data-title="".

It has to be done dynamically and on a per-link basis, like how I'm already targeting the links.

Here's an example of a real IMDb link:

http://www.imdb.com/title/tt0068646/

Just the tt0068646 portion would need to be copied over like so data-title="tt0068646". Again, dynamically, because the user can enter any link, of hundreds of thousands of possibilities.

regex is one option with /imdb\.com\/title\/(\w+)/. But, how could that be implemented within this context?

Upvotes: -1

Views: 63

Answers (1)

Jebus905
Jebus905

Reputation: 26

You will probably need to iterate over each link instead of attempting to change all of them at once.

jQuery('[href*="imdb.com/title"]').each(function() {
    var id = /imdb\.com\/title\/(\w+)/.exec(jQuery(this).prop("href"));
    $(this)
        .addClass('imdb-link')
        .after(' <span class="imdbRatingPlugin" data-title="' + id[1] + '" data-style="p4"><img src="logo.png" alt="IMDb" style="max-height:16px" /> </span>');
});

Doing it in this manner is slower, but it allows you to access the individual element's properties.

Alternatively, you may need to use jQuery(this).attr("href")

Upvotes: 1

Related Questions