Select a link by it's URL and totally rewrite that link
Hi, I'm new at this so I don't even know if this is possible, but here's exactly what I'd like to do:
1. scan all links on the page (which look like "
<a href="
<Link URL>
">
<Link Title>
</a>")
2. if any of the
<Link URL>s begin with "http://youtube.com/watch/", "http://flickr.com/", or "http://imgur.com/" then,
3. rewrite the entire link like this:
- <div id = "my-target">
-
- <a href="#" onclick="return hs.htmlExpand(this, { contentId: '<Link URL>', width: 495, align: 'center', allowWidthReduction: true} )" class="highslide">'<Link Title>'</a>
-
- <div class="highslide-html-content" id="<Link URL">">
- <div class="highslide-body"> '<LInk URL>'</div>
- </div>
- </div>
-
The reason I'm doing this is I already have another script that filters through all of the URLs on a page and if any of them come from a site that is registered with the oEmbed service it will embed the linked video or image instead of printing the URL. But it only works if it's a plain URL with no markup.
So what this will do is check to see if a formatted link directs to Youtube, Flickr, etc. and instead of linking directly to the page it will rewrite the formatted html link so it opens a popup window with the plain-text URL of the link printed inside it. Then the oEmbed script will take that plain-text link and transform it into an embedded Youtube video or Flickr image. If the link is not from one of the sites listed it the jQuery script needs to leave it alone.
I'm only using the URL as an ID because it's the closest I can get to a unique ID, unless I can do it with a random number.
Does anybody know how to do this, or have an opinion about whether it's possible?
Thanks