关于javascript：URL的最后一段


Last segment of URL

如何获取URL的最后一段？我有以下脚本，显示单击的锚标记的完整URL：

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

如果URL是

1
http://mywebsite/folder/file

我如何才能让它在警报框中只显示URL的"文件"部分？

相关讨论

您还可以使用lastindexof()函数在URL中查找最后一次出现的/字符，然后使用substring()函数返回从该位置开始的子字符串：

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

这样，您就可以避免创建一个包含所有URL段的数组，就像split()所做的那样。

相关讨论

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

console.log(lastSegment);

相关讨论

1
window.location.pathname.split("/").pop()
相关讨论

另一个解决方案是regex。

1
2
var href = location.href;
console.log(href.match(/([^\/]*)\/*$/)[1]);
相关讨论

javascript具有与字符串对象相关联的函数split，可以帮助您：

1
2
3
4
var url ="http://mywebsite/folder/file";
var array = url.split('/');

var lastsegment = array[array.length-1];

或者可以使用正则表达式：

1
alert(href.replace(/.*\//, ''));
1
2
var urlChunks = 'mywebsite/folder/file'.split('/');
alert(urlChunks[urlChunks.length - 1]);

我知道，现在太迟了，但对其他人来说：我强烈推荐使用purl jquery插件。purl的动机是url也可以被分割(例如：angular.js链接)，也就是说，url看起来像

1
    http://test.com/#/about/us/

或

1
    http://test.com/#sky=blue&grass=green

使用purl，您可以很容易地决定(segment/fsegment)要得到哪个段。

对于"经典"的最后一段，你可以写：

1
2
    var url = $.url('http://test.com/dir/index.html?key=value');
    var lastSegment = url.segment().pop(); // index.html

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

为此，最好使用url对象，以获得更健壮的解决方案。它是对当前URL的解析解释：

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

1
2
const last = new URL(href).pathname.split('/').pop();
console.log(last);

输出：'boo'。

这适用于所有常见的浏览器。只有我们垂死的人不支持这一点。但是，对于IE来说，有一种填充物可用(如果你真的在乎的话)。

基于fr_d_ric的答案，仅使用javascript：

1
2
3
var url = document.URL

window.alert(url.substr(url.lastIndexOf('/') + 1));

也，

1
2
var url = $(this).attr("href");
var part = url.substring(url.lastIndexOf('/') + 1);
1
window.alert(this.pathname.substr(this.pathname.lastIndexOf('/') + 1));

使用本机pathname属性是因为它最简单，并且已经被浏览器解析和解决。$(this).attr("href")可以返回像../..这样的值，这不会给您正确的结果。

如果您需要保留search和hash(例如foo?bar#baz与http://quux.com/path/to/foo?bar#baz之间)，请使用：

1
window.alert(this.pathname.substr(this.pathname.lastIndexOf('/') + 1) + this.search + this.hash);
相关讨论

如果您不担心使用split生成额外的元素，那么filter可以处理您提到的尾随斜杠问题(假设您有对filter的浏览器支持)。

1
url.split('/').filter(function (s) { return !!s }).pop()
1
2
3
4
5
// Store original location in loc like: http://test.com/one/ (ending slash)
var loc = location.href;
// If the last char is a slash trim it, otherwise return the original loc
loc = loc.lastIndexOf('/') == (loc.length -1) ? loc.substr(0,loc.length-1) : loc.substr(0,loc.lastIndexOf('/'));
var targetValue = loc.substr(loc.lastIndexOf('/') + 1);

目标值=1

如果您的URL如下所示：

http://test.com/one/

或

http://test.com/one

或

http://test.com/one/index.htm

然后loc看起来像：http://test.com/one

现在，由于您需要最后一个项目，请运行下一步以加载最初需要的值(targetValue)。

1
var targetValue = loc.substr(loc.lastIndexOf('/') + 1);
相关讨论

要获取当前窗口的最后一段：

window.location.href.substr(window.location.href.lastIndexOf('/') +1)

1
2
var pathname = window.location.pathname; // Returns path only
var url      = window.location.href;     // Returns full URL

复制自此答案

更新的raddevus答案：

1
2
3
var loc = window.location.href;
loc = loc.lastIndexOf('/') == loc.length - 1 ? loc.substr(0, loc.length - 1) : loc.substr(0, loc.length + 1);
var targetValue = loc.substr(loc.lastIndexOf('/') + 1);

将URL的最后一个路径打印为字符串：

1
2
3
test.com/path-name = path-name

test.com/path-name/ = path-name

如果结尾有/可以先删除，然后获取URL的最后一部分

1
2
3
4
5
let locationLastPart = window.location.pathname
if (locationLastPart.substring(locationLastPart.length-1) =="/") {
  locationLastPart = locationLastPart.substring(0, locationLastPart.length-1);
}
locationLastPart = locationLastPart.substr(locationLastPart.lastIndexOf('/') + 1);

返回最后一段，不考虑尾随斜杠：

1
2
3
var val = 'http://mywebsite/folder/file//'.split('/').filter(Boolean).pop();

console.log(val);

1
2
3
4
5
6
7
8
// https://x.com/boo/?q=foo&s=bar = boo
// https://x.com/boo?q=foo&s=bar = boo
// https://x.com/boo/ = boo
// https://x.com/boo = boo

const segment = new
URL(window.location.href).pathname.split('/').filter(Boolean).pop();
console.log(segment);

为我工作。

我认为在执行子字符串之前删除尾斜线("/")比较安全。因为在我的场景中有一个空字符串。

1
window.alert((window.location.pathname).replace(/\/$/,"").substr((window.location.pathname.replace(/\/$/,"")).lastIndexOf('/') + 1));

我正在使用regex和split:

var last_path=location.href.match(/./(.[w])/)[1].split("")[0].split("？")〔0〕

最后，它将忽略？&；/结束URL，这经常发生。例子：

https://cardsrealm.com/profile/cardsrealm->返回cardsrealm

https://cardsrealm.com/profile/cardsrealm您好->返回cardsrealm

https://cardsrealm.com/profile/cardsrealm？您好->返回cardsrealm

https://cardsrealm.com/profile/cardsrealm/->返回cardsrealm

我真的不知道regex是否是解决这个问题的正确方法，因为它确实会影响代码的效率，但是下面的regex将帮助您获取最后一个段，即使URL后面跟着一个空的/，它仍然会给您最后一个段。我想到的正则表达式是：

1
[^\/]+[\/]?$