How to target="_blank" a link while keeping it XHTML compliant with jQuery

I run my page though a HTML validator and am quickly reminded that the target attibute is not allowed in the XHTML 1.0 Strict standard.  I do a quick Google Search and the first couple of results bring back the following function to make it compliant:

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 function expects there to be a rel="external" attribute inside the links you want to open in a new window.

That function to me looks scary and ugly.  jQuery to the rescue.

$(document).ready(function(){
    $("a[rel='external']").attr("target","_blank");
});


I was able to shrink all that down to one line of jQuery.  And it's a lot easier to read and more importantly it now makes the document XHTML compliant.

Note: I did notice a huge argument/discussion on if this is really truely standards compliant.  As when you take the generated html code and run that through the validator you still get the same compliance error.  While others say that you are separating the action from the presentation and that satisfies the standard.  Thirdly others say that target was depricated and as such we should never use it because the standards people think we shouldn't open new windows on people.   I don't know whose right or whose wrong but I did find the discussion interesting.  Thoughts?

Saturday, June 28 2008 at 10:25 PM | Comments [1]
Tags: How-to | Programming | Technology