使用jQuery修改a标签href后链接追加到当前URL的问题排查

问题出在API返回的维基百科链接缺少完整的协议头（比如https://），浏览器会把没有协议前缀的URL当成相对路径，自动拼接到当前页面的域名后面，这才出现了localhost/myappname/en.wikipedia.org/wiki/France这种错误跳转。

target="_blank"的作用只是让链接在新窗口打开，和URL的路径解析逻辑完全无关，所以它解决不了这个问题。

解决步骤 #

• 先检查API返回的wikipediaUrl字段值，确认是否以https://或http://开头。
• 如果没有协议头，设置href时手动补上，代码示例：

const wikiUrl = result['data'][0]['wikipediaUrl'];
// 正则判断是否包含协议前缀，不区分大小写
if (!/^https?:\/\//i.test(wikiUrl)) {
  $('#txtWiki').attr('href', `https://${wikiUrl}`);
} else {
  $('#txtWiki').attr('href', wikiUrl);
}

这样就能确保浏览器识别这是一个绝对URL，直接跳转到维基百科的页面。

内容的提问来源于stack exchange，提问作者lizmosis