新窗口打开超链接的技巧

超链接跳转常用在友情链接中,或链接到其他网站,为了可以把你的访问者继续留在自己的主页而使用的一个技巧。现在我就要说说常用的几种跳转技巧:

1.使用html标签的target属性:

该方法恐怕是大家使用最多的方法,也是所有web工具所默认的。只需在链接a标签中加入属性target属性即可:如下

<a href="http://www.ihiro.org/ title="Hiro's Blog" target="_blank">www.ihiro.org</a>

在web标准流行的当代,也许大家已经发现,该方法不能通过W3C的验证。

2.使用Javascript代码:

在a标签中加入rel=“external”属性:如下

<a href="http://www.ihiro.org/ title="Hiro's Blog" rel="external">www.ihiro.org</a>

运用jQuery框架,在页面中导入js文件,编写代码:如下

<script type="text/javascript">
        $('a[rel*=external]').attr('target', '_blank');
</script>

该方法好处是欺骗了浏览器,可以通过W3C的验证。

附加技巧:

在一列友情链接都需要跳转时,我们不可能为每个a标签都添加rel=“external”属性.这是可以使用类或id的方法:如下

<ul class="external">
        <li><a href="http://www.ihiro.org/ title="Hiro's Blog">www.ihiro.org</a> </li>
        <li><a href="http://www.ihiro.org/ title="Hiro's Blog">www.ihiro.org</a> </li>
        <li><a href="http://www.ihiro.org/ title="Hiro's Blog">www.ihiro.org</a> </li>
        <li><a href="http://www.ihiro.org/ title="Hiro's Blog">www.ihiro.org</a> </li>
</ul>

jQuery代码:如下

<script type="text/javascript">
        $('ul.external li a').attr('target', '_blank');
</script>

这样这个ul列表中的所有友情链接都可以实现页面跳转了。

总结:

当然你也可以不使用jQuery框架,直接使用普通的javascript编写也可以实现,但没有jQuery实现的如此优雅。上文中的external其实是可以随便命名的,自需要保持javascriprt中的名称相同即可。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值