jquery中URL的最后一段

IT技术 javascript jquery
2021-01-30 04:19:56

如何获取 url 的最后一段?我有以下脚本显示单击的锚标记的完整 url:

$(".tag_name_goes_here").live('click', function(event)
{
    event.preventDefault();  
    alert($(this).attr("href"));
});

如果网址是

http://mywebsite/folder/file

我如何才能让它在警告框中显示 url 的“文件”部分?

6个回答

您还可以使用lastIndexOf()函数定位/URL 中最后一次出现的字符,然后使用substring()函数返回从该位置开始的子字符串:

console.log(this.href.substring(this.href.lastIndexOf('/') + 1));

这样,您将避免创建一个包含所有 URL 段的数组,就像split()这样。

如果 url/末尾包含 a怎么办?
2021-03-11 04:19:56
@oshirowanen,不,但它会从每个 URL 段创建一个数组元素。由于您只对最后一段感兴趣,因此分配许多您永远不会使用的数组元素可能会很浪费。
2021-03-18 04:19:56
但是,如果 url 变成admin/store/tour/-1/这样,它将是''字符串?
2021-03-20 04:19:56
@Set,也许更好,但肯定更慢。
2021-03-23 04:19:56
收件人:@Set Kyar Wa Lar Aug 和@Sнаđошƒаӽ/结尾包含 a 的网址的解决方案var url = window.location.href.replace(/\/$/, ''); /* remove optional end / */ var lastSeg = url.substr(url.lastIndexOf('/') + 1);
2021-03-25 04:19:56

var parts = 'http://mywebsite/folder/file'.split('/');
var lastSegment = parts.pop() || parts.pop();  // handle potential trailing slash

console.log(lastSegment);

Split 会将您的 url 转换为一个数组,其中每个 url 部分都以“/”分隔。因此,最后一段是 url 和随后创建的数组的最后一个元素。
2021-03-24 04:19:56
旁注:如果 URL 上确实设置了查询参数(例如.../file?var=value&foo=bar,这将不起作用该解决方案以更强大和现代的方式解决了这个问题:stackoverflow.com/a/51795122/1123743
2021-03-27 04:19:56
你能解释一下它是如何工作的吗?据我所知 .pop() 用于删除数组的最后一个元素。但在这里它显示了我网址的最后一个元素!
2021-03-28 04:19:56
如果 url 以“/”结尾,这将不起作用,即 http://mywebsite/folder/file/
2021-04-07 04:19:56
@PeterLudlow 它有效,因为空字符串在 JS 抽象"" == false是假的,在这种情况下,它用空字符串弹出数组的一部分
2021-04-08 04:19:56
window.location.pathname.split("/").pop()
@SebastianBarth 这不是在寻找查询字符串参数。对 .pathname 的调用将它们去掉,因为重点是获取 url 路径的最后一段,而不管是否有查询参数。
2021-03-16 04:19:56
这正是我正在寻找的。使用 react-router-dom 这是我发现的最干净的解决方案,可以找到 URL 的最后一部分尾随最后一个正斜杠/console.log(history.location.pathname.split("/").pop()) 如果有更好的方法我想知道!希望这条评论可以引导更多人找到您的答案。谢谢@Dblock247
2021-03-19 04:19:56
旁注:如果 URL 上确实设置了查询参数(例如.../file?var=value&foo=bar,这将不起作用该解决方案以更强大和现代的方式解决了这个问题:stackoverflow.com/a/51795122/1123743
2021-04-01 04:19:56

正则表达式的另一种解决方案。

var href = location.href;
console.log(href.match(/([^\/]*)\/*$/)[1]);

如果路径很简单,仅由简单的路径元素组成,则其他答案可能有效。但是当它也包含查询参数时,它们就会中断。

最好为此使用URL对象,以获得更强大的解决方案。它是对当前 URL 的解析解释:

输入: const href = 'https://stackoverflow.com/boo?q=foo&s=bar'

const segments = new URL(href).pathname.split('/');
const last = segments.pop() || segments.pop(); // Handle potential trailing slash
console.log(last);

输出: 'boo'

这适用于所有常见的浏览器。只有我们垂死的IE 不支持(并且不会)不过,对于 IE,有一个polyfills可用(如果你在乎的)。