JavaScript实现链接在新窗口打开的三种方法

作者:流萤

时间:2026-10-27

浏览:435

本文介绍在网页中实现链接在新窗口打开的三种常用方法。首先通过jQuery筛选外部链接并添加target属性;其次使用原生JavaScript遍历所有a标签设置target;最后利用HTML的base标签全局指定默认目标。三种方案各有适用场景,可根据项目需求选择。

文章目录

jQuery实现外部链接新窗口打开

第一种方案是利用jQuery库来实现。其核心逻辑是定位页面中指向外部域名的链接,并为其添加target="_blank"属性。具体实现代码如下:


使用jQuery实现新窗口打开


 

代码示例如下:

$("a[href*='http://']:not([href*='"+location.hostname+"']),[href*='https://']:not([href*='"+location.hostname+"'])")
.addClass("external")
.attr("target","_blank");

原生JavaScript实现新窗口打开

第二种方案是使用原生JavaScript实现。


 

代码示例如下:

var aTag = document.getElementsByTagName('a');
for(i in aTag){
aTag[i].target='_blank';
}  

HTML base标签全局设置新窗口

第三种方案是基于HTML标签实现。


在页面的head部分添加以下代码:


<base target='_blank' />


这样即可使页面内所有链接默认在新窗口中打开。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章