Scribblings and Geekery

I was throwing together a prototype site last night and I thought it might be nice to aim for XHTML 1.1 Strict compliance, really just for kicks. Most of the time, this is no big deal, but I was stuck on one need that the site had: open off-site links in a new window. The target attribute is a big no-no in XHTML Strict and while I'm not really a purist, it was somewhat bothersome that I only had one error left without a good markup-based solution.

One of the tenets of XHTML is to force (strictly!) the user-agent to be responsible for the agent-specific actions on the page. In this case, since a modern browser on a modern OS can handle a "new window", the browser should handle it. But, the same site, when rendered in a different browser (e.g. Safari on the iPhone) might not be able to handle a new window, so the markup itself shouldn't add such an instruction. Sounds annoyingly simple enough, except when I want the non-standard action.

Enter JavaScript, which shouldn't surprise me since I want to manipulate the DOM within browsers that can handle it. A quick google led me to an example over at Sitepoint using Javascript to add the target="_blank" attribute after the page loads:

1
2
3
4
5
6
7
8
9
10
11

function externalLinks() {
    if (!document.getElementsByTagName) return;
    var anchors = document.getElementsByTagName("a");
    for (var i=0; i<anchors.length; i++) {
        var anchor = anchors[i];
        if (anchor.getAttribute("href") &&
            anchor.getAttribute("rel") == "external")
            anchor.target = "_blank";
    }
}
window.onload = externalLinks;

This really seemed inelegant to me. I'm already using jQuery on the site for something else, so I re-wrote the above into a jQuery chain, which just feels better:

1

$("a[rel='external']").attr("target","_blank");