I’m using this javascript to replace all of my links with registration messages:
<script>
function replaceLinks() {
var links = document.querySelectorAll('.restore a:link');
for (var i = 0; i < links.length; i++) {
links[i].innerHTML = 'DOWNLOAD register here.';
links[i].href = 'register.php';
}
}
</script>
The problem:
It’s replacing all thumbnail images (that link to their full-size images), too. I can’t apply a specific CSS selector to just links because I’m using vBulletin and it would apply it to both links and images inside of the post content.
Does anyone know how I can…
forbid this Javascript from applying to links that end with .jpg, .gif, etc – so it only rewrites the links, and not the thumbnails that link to their full sized images?
The obvious way would be to give only the links you want to have replaced a common class and target that class.
Thank you for the response. However, as stated in the post “I can’t apply a specific CSS selector to just links because I’m using vBulletin and it would apply it to both links and images inside of the post content.”
I was able to find the solution via StackOverflow:
function replaceLinks() {
var links = document.querySelectorAll('.restore a:link');
for (var i = 0; i < links.length; i++) {
if (/\\.(png|jpe?g)$/.test(links[i].href)) continue;
links[i].innerHTML = 'DOWNLOAD register here.';
links[i].href = 'register.php';
}
}
This only continues if the result is false (for the png/jpg, etc)
This forum is vBulletin and it has
<li class="left">
<a href="http://www.mittineague.com" class="siteicon_homepage">
Visit Homepage
</a>
</li>
.....
<a class="postuseravatar" href="member.php?83449-Mittineague" title="Mittineague is online now">
<img src="image.php?u=83449&dateline=1346451258" alt="Mittineague's Avatar" title="Mittineague's Avatar" />
</a>
- the avatar image’s link has the class “postuseravatar”
- the link with no image has the class “siteicon_homepage”