One way of opening links in new windows is to insert the HTML
target="_blank" attribute into all necessary anchor elements (
<a href=""></a>). This method works well, but generates validation errors when used with XHTML-Strict doctypes.
To implement this unobtrusive, gracefully degradable strategy, simply replace any
target="_blank" attributes with the XHTML-friendly
rel="external" attribute. Using
rel="external" is standards-compliant and thus completely valid, even for XHTML-Strict and XHTML-1.1 doctypes.
After you have prepared your external link anchors with
rel attribute is set to
external. However, in many situations, especially when working with WordPress and its myriad plugins, external links are also tagged with additional properties, such as nofollow, for example. The code presented in this article opens all links with any of the following attributes in a new window (click links for demo):
Of course, by modifying and/or emulating the sequence of
anchor.getAttribute() expressions, it is relatively (no pun intended) straightforward to trigger blank-target behavior for virtually any
- 1 This script has been adapted from the technique presented at Sitepoint.com