专栏首页技术小黑屋每周一脚本:js设置链接为新标签打开

每周一脚本:js设置链接为新标签打开

由于Markdown在编辑Octopress文章的链接时无法指定打开方式,所以很多时候需要使用html写。后来想了一下,为什么不通过javascript把超链接的打开方式默认成新标签实现呢。

JQuery中提供了一个DOM元素插入事件 DOMNodeInserted ,我们可以通过监听这个事件,对没有target属性值的a标签设置其target为_blank。这样就实现了默认新标签打开了。

脚本代码

lineos:false

1 2 3 4 5 6 7 8 9 10

/*To use the DOMNodeInserted event listening, jquery is required*/ $(document).bind('DOMNodeInserted', function(event) { $('a[href^="http"]').each( function(){ if (!$(this).attr('target')) { $(this).attr('target', '_blank') } } ); });

示例

lineos:false

1 2 3 4 5 6 7

<html> <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript" src="https://rawgit.com/androidyue/weekly-scripts/master/javascript/target_blank_link.js"></script> <body> <a href="http://droidyue.com">droidyue</a> </body> </html>

上述示例在浏览器加载之后,就会对a标签添加target=“_blank”属性。

每周一脚本@Github

其他

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • ECMAScript 6教程 (三) Class和Module(类和模块)

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出 原文连接,博客地址为 http://www.cnblogs.co...

    笔阁
  • 你的Java代码对JIT编译友好么?

    本文为 InfoQ 中文站特供稿件,首发地址为:你的Java代码对JIT编译友好么?。如需转载,请与 InfoQ 中文站联系。

    技术小黑屋
  • ECMAScript 6教程 (二) 对象和函数

    上面代码的方法一是直接用标识符作为属性名,方法二是用表达式作为属性名,这时要将表达式放在方括号之内。

    笔阁
  • 测试利器Mocha

    mocha 是一个功能丰富的javascript测试框架,可以运行在nodejs和浏览器环境,使异步测试变得简单有趣。mocha 串联运行测试,允许灵活和精确地...

    笔阁
  • ECMAScript 6教程 (一)

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出 原文连接,博客地址为 http://www.cnblogs.co...

    笔阁
  • JavaScript权威指南 - 数组

    JavaScript数组是一种特殊类型的对象。 JavaScript数组元素可以为任意类型,最大容纳232-1个元素。 JavaScript数组是动态的,有...

    Esofar
  • JavaScript权威指南 - 函数

    函数本身就是一段JavaScript代码,定义一次但可能被调用任意次。如果函数挂载在一个对象上,作为对象的一个属性,通常这种函数被称作对象的方法。用于初始化一个...

    Esofar
  • JSON 数据格式

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。JSON采用完全独立于语言的文本格式,这些特性使JSON成为理想的...

    Rekent
  • JSP/Servlet Web 学习笔记 DayThree —— 实现一个登陆小界面

      利用JSP、HTML、JS实现了一个简易的登陆系统。根据前两天的所学,实现了如下功能:

    Rekent
  • ionic入门之AngularJS扩展

    ionic是一个强大的混合式/hybridHTML5移动开发框架,特点是使用标准的HTML、 CSS和JavaScript,开发跨平台(目前支持:Android...

    笔阁

扫码关注云+社区

领取腾讯云代金券