target=”_blank” XHTML replacement.

December 16th 2009

As you must already know, using target=”_blank” to open a page in a new window doesn’t validate in XHTML.

There’s a javascript workaround tho. This example is based on jQuery since it’s always included in my project and it’s my library of choice but it could be easily converted to any library.

The basics

To replace the target=”_blank” you should use the rel attribute. This attribute is used to specify the relationship  between the document that contains the link and the document it refers to. So your links should have the attribute rel=”external” to specify the link is not a link inside your website but to another website. There are plenty of values possible for you rel attributes, I invite you to read about microformats.

Now rel=”external” doesn’t mean target=”_blank”. Adding that attribute won’t open the links in new windows, it’s only a more semantic way of specifying the relationship between pages. Since some of you might not want to open rel=”external” in new windows, browser vendors didn’t implement it as being the same as a target=”_blank”. That when javascript comes into play.

The javascript

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

Easy isn’t it?

You actually need to either put that in a script of his own or at the bottom of you webpages. $(function(){ }); is actually the short document.ready call in jQuery. Once the document is ready, it’ll traverse through each link and add the attribute target=”_blank” to them. This way the W3C validator doesn’t see them and you page still validates.

Working markup

Here’s a working example with jQuery loaded.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
	<head>
		<script src="http://www.google.com/jsapi" type="text/javascript"></script>
		<script type="text/javascript">
			google.load("jquery", "1.3.2");
		</script>

		<script type="text/javascript" charset="utf-8">
			$(function(){
				$('a[rel="external"]').attr('target','_blank');
			});
		</script>
	</head>
	<body>
		<a href="http://google.com" rel="external">Google!</a>
		<a href="http://no-margin-for-errors.com" rel="external">My site!</a>
	</body>
</html>

Your opinion?

What do you think about this technique? I personally stopped caring about my pages not validating when I use target=”_blank”, but I know some people really want to see their page validates whatever the price.

52 Responses to “target=”_blank” XHTML replacement.”


  1. pokerseleb says:

    banyak situs poker online yang menjanjikan banyk keuntungan bagi para pemainnya tetapi tidak jarang juga yang tidak mendapatkan keuntungan. tetapi berbeda jika anda bermain di pokerseleb anda hanya mempunyai modal 100 ribu bisa bermain dengan banyak keuntungan dan bonus setiap hari yang akan di bagikan setiap hari untuk anda jadi anda tidak perlu takut untuk bermain judi poker online di pokerseleb .
    “https://pokerseleb.wordpress.com/2019/09/30/situs-idn-poker-online-terpercaya/”

Leave a Reply