xhtml external links

home | software | javascripts | xhtml external links

I am striving to keep my markup compliant with the XHTML-strict specification. Specifically, I want the W3C Validator to pass my pages.

However at times this can be frustrating, especially if you're used to how browsers worked at the turn of the century.

One difficulty I faced involved forcing external pages to launch in their own window (or tab for Mozilla users). XHTML strict, in fact no strict HTML specification has ever included the 'target' attribute for anchor elements. Instead, we're advised to use window.open(...); javascript. This can be quite verbose. Hey presto, Javascript to the rescue...

Instead of this code:

Use this much more concise code:

Of course you'll also need to import the javascript file, which you can do in the head section of your HTML document:

The xhtml-external-links.js scans all links in your document and attaches it's own event handler to open the link in a new window if the external value is contained within the rel attribute. Note that other values (such as nofollow) may exist (such as nofollow) as the rel attribute is defined as a space separated list.

Click this button to use the W3C validator on this page

the code

xhtml-external-links.js - right-click and choose save as

// Script written by Drew Noakes -- http://drewnoakes.com function initLinks() { for (i in document.links) { link = document.links[i]; if (link.rel && link.rel.indexOf('external')!=-1) { link.onclick = onExternalLinkActivate; link.onkeypress = onExternalLinkActivate; } } } function onExternalLinkActivate() { window.open(this.href); return false; } window.onload = initLinks;