href标签target=_blank属性的妙用
我们都知道 html 超链接标签 href 属性 target="_blank" 的作用是使打开的链接以新开的窗口形式出现。但是除了直接写在 href 标签里面，你还知道有其他更巧妙的给链接加 target="_blank" 的办法吗？下面作者将要和大家分享的是如何巧妙的使用 href target="_blank" 这个标签。
首先来看看 target="_blank" 的用处：
<a href="http://www.phpernote.com/php-template-framework/189.html" target="_blank">php+js 实现瀑布流效果</a>
<form action="http://www.phpernote.com/php-function/172.html" target="_blank">10个不常见却非常有用的PHP函数<input type="submit" value="提交按钮"></form>
上面的代码中，如果不加 target="_blank" 这个属性，默认均为本页直接打开，即：target="_self"。
下面说一下怎么会突然想到这个标签的吧！作者网站在当初设计时，对于链接这一块，没有做太多的想法，所有链接元素打开的方式都是_self。现在才发现存在不少问题，本站自己的内链就不说什么了，但是发表在文章内容中的链接，多半是指向别人网站的连接，而这些链接也都是直接通过_self形式打开的，这个问题就来了，用户体验度不好不说，对自己网站的流量，权重都是个挺大的损失。那怎么解决这个问题呢？我需要的是在网页页面局部实现 href 的 target="_blank" 属性，最后想出了两种方法：
（1）给这些链接一个个手动去加上target="_blank"，但这个方法太笨了，太费时费力。
（2）在页面 head 标签内加上 <base target="_blank"> 这个标签，就一劳永逸了。这个标签可以使得页面上的所有连接都以新开窗口的形式打开。但是感觉这个用户体验度很不好，用户才浏览了几个网页就打开的全是我的网站了，这会让人很不爽，至少我是这么感觉的。而且这个在严格的W3C标准中是不标准的，至于为什么？原因很人性化，是因为外国人认为，不经过用户同意，就随便打开新窗口，是不礼貌的，不尊重用户的选择。
那这个时候该怎么办呢？
搜索了大量的资料得出 href 标签在 HTML 4.0 增加了一个新属性：rel，这个属性用来说明链接和包含此链接页面的关系，以及链接打开的目 标。rel 有许多的属性值，比如next、previous,、chapter、section 等等。这里我们可以使用 rel="external" 属性。那么原来这样写的代码：
<a href="http://www.phpernote.com/javascript-function/510.html" target="_blank">右下角弹出广告 js，漂浮效果（兼容多浏览器）</a>
现在要写成这样：
<a href="http://www.phpernote.com/javascript-function/510.html" rel="external">右下角弹出广告 js，漂浮效果（兼容多浏览器）</a>
这是符合strict标准的方法。但是这里还必须配合一个javascript才有效，相关的代码JS如下：
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;
你可以将以上代码保存成一个.js文件(比如external.js)，然后通过外部联接方法调用：
<script type="text/javascript" src="http://www.phpernote.com/external.js"></script>
这样就解决了在网页页面局部实现 href 的 target="_blank" 属性的问题了。