如何测试链接是外部链接还是内部链接？请注意：
- 我无法对本地域进行硬编码。
- 我无法测试“http”。我可以很容易地使用 http 绝对链接链接到我自己的网站。
- 我想使用 jQuery/javascript，而不是 css。
我怀疑答案在 location.href 中的某个地方，但解决方案回避了我。
谢谢！
使用 jQuery/javascript 测试链接是否为外部链接？
IT技术
javascript
jquery
location
href
2021-03-05 12:23:05
6个回答
我知道这篇文章很旧，但它仍然显示在结果的顶部，所以我想提供另一种方法。我看到了对锚元素的所有正则表达式检查，但为什么不直接使用window.location.host和检查元素的host属性呢？
function link_is_external(link_element) {
return (link_element.host !== window.location.host);
}
使用 jQuery：
$('a').each(function() {
if (link_is_external(this)) {
// External
}
});
并使用普通的javascript：
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
if (link_is_external(links[i])) {
// External
}
}
var comp = new RegExp(location.host);
$('a').each(function(){
if(comp.test($(this).attr('href'))){
// a link that contains the current host
$(this).addClass('local');
}
else{
// a link that does not contain the current host
$(this).addClass('external');
}
});
注意：这只是一个快速而肮脏的例子。它也会将所有 href="#anchor" 链接匹配为外部链接。可以通过进行一些额外的 RegExp 检查来改进它。
更新 2016-11-17
这个问题仍然有很多流量，很多人告诉我这个被接受的解决方案将多次失败。正如我所说，这是一个非常快速和肮脏的答案，展示了如何解决这个问题的主要方法。更复杂的解决方案是使用可在<a>（锚）元素上访问的属性。像@Daved已经在这个回答中指出，关键是要比较hostname与当前window.location.hostname。我更愿意比较这些hostname属性，因为如果它与 80 不同，它们从不包括port包含在host属性中的 。
所以我们开始：
$( 'a' ).each(function() {
if( location.hostname === this.hostname || !this.hostname.length ) {
$(this).addClass('local');
} else {
$(this).addClass('external');
}
});
最先进的：
Array.from( document.querySelectorAll( 'a' ) ).forEach( a => {
a.classList.add( location.hostname === a.hostname || !a.hostname.length ? 'local' : 'external' );
});
和无 jQuery 的方式
var nodes = document.getElementsByTagName("a"), i = nodes.length;
var regExp = new RegExp("//" + location.host + "($|/)");
while(i--){
var href = nodes[i].href;
var isLocal = (href.substring(0,4) === "http") ? regExp.test(href) : true;
alert(href + " is " + (isLocal ? "local" : "not local"));
}
所有不以http(http://, https://)开头的 href 都会被自动视为本地
var external = RegExp('^((f|ht)tps?:)?//(?!' + location.host + ')');
用法：
external.test('some url'); // => true or false
这是一个仅用于外部链接的 jQuery 选择器：
$('a[href^="(http:|https:)?//"])')
仅用于内部链接（不包括同一页面内的哈希链接）的 jQuery 选择器需要更复杂一些：
$('a:not([href^="(http:|https:)?//"],[href^="#"],[href^="mailto:"])')
额外的过滤器可以放置在:not()条件中，并根据需要用额外的逗号分隔。
http://jsfiddle.net/mblase75/Pavg2/
或者，我们可以使用 vanilla JavaScripthref属性过滤内部链接，该属性始终是绝对 URL：
$('a').filter( function(i,el) {
return el.href.indexOf(location.protocol+'//'+location.hostname)===0;
})