下面是jquery实现外部链接用新窗口打开的方法的完整攻略：
Step 1. 引入jquery库
在网页head标签中引入jquery库，比如：
<head>
<script src="//cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
</head>
Step 2. 编写jquery代码
在网页body标签中编写jquery代码，使用jQuery选择器获取所有外部链接（即含有href属性并且不含有当前域名的链接），并且为这些链接的target属性添加"_blank"，让链接在新的窗口中打开。
示例 1：
$(document).ready(function(){
$('a[href^="http"][href*="' + document.domain + '"]').each(function(){
$(this).attr('target', '_blank');
});
});
解释一下这段代码，首先使用jQuery选择器获取所有外部链接，即使用$('a')获取所有a标签，但是需要过滤掉不是外部链接的a标签，即：包含当前域名的a标签需要过滤掉，然后使用each()遍历每一个外部链接，并为每一个链接的target属性添加"_blank"，让链接在新的窗口中打开。
示例 2：
$(document).ready(function(){
$('a').each(function(){
var href = $(this).attr('href');
if (href.indexOf('http') === 0 && href.indexOf(document.domain) === -1) {
$(this).attr('target', '_blank');
}
});
});
解释一下这段代码，首先使用jQuery选择器获取所有的a标签，并且遍历每一个a标签，获取当前a标签的href属性，然后判断当前链接是否为外部链接，即：以http开头并且不包含当前域名，如果是则为链接添加"_blank"，使其在新的窗口中打开。
Step 3. 测试代码
将第二步的代码复制到网页的body标签中，并且添加几个外部链接进行测试，例如：
<body>
<a href="/">首页</a>
<a href="http://baidu.com">百度</a>
<a href="http://google.com">Google</a>
<a href="/about-us">关于我们</a>
</body>
打开测试网页，检查外部链接是否已经成功打开新的窗口。
以上就是jquery简单实现外部链接用新窗口打开的方法的完整攻略，你可以在自己的网站上应用这个方法。
本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：jquery简单实现外部链接用新窗口打开的方法 - Python技术站
微信扫一扫 
支付宝扫一扫 