Letztes Segment der URL


228

Wie erhalte ich das letzte Segment einer URL? Ich habe das folgende Skript, das die vollständige URL des angeklickten Ankertags anzeigt:

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

Wenn die URL ist

http://mywebsite/folder/file

Wie kann ich nur den "Datei" -Teil der URL im Warnfeld anzeigen?


Unten ist meine funktionierende Java-Skriptlösung. Ich hoffe, es hilft. stackoverflow.com/a/38370175/610951
Ravi Shankar Kota

Antworten:


368

Sie können auch die Verwendung lastIndexOf () Funktion das letzte Vorkommen der lokalisieren /Zeichen in der URL, dann ist die substring () Funktion des Teil von dieser Position beginnen zurückzukehren:

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

Auf diese Weise vermeiden Sie, dass ein Array erstellt wird, das alle Ihre URL-Segmente split()enthält.


3
@oshirowanen, nein, aber es wird ein Array-Element aus jedem URL-Segment erstellt. Da Sie nur am letzten Segment interessiert sind, kann es verschwenderisch sein, viele Array-Elemente zuzuweisen, die Sie niemals verwenden werden.
Frédéric Hamidi

11
Aber wenn die URL so geworden wäre admin/store/tour/-1/, wäre es eine ''Zeichenfolge?
Wa Lar

1
@ Set, schöner vielleicht, sicherlich langsamer.
Frédéric Hamidi

1
Was ist, wenn die URL /am Ende ein enthält ?
Sнаđошƒаӽ

6
Attn: @Set Kyar Wa Lar Aug und @ Sнаđошƒаӽ Lösung für URL, die /am Ende ein enthält :var url = window.location.href.replace(/\/$/, ''); /* remove optional end / */ var lastSeg = url.substr(url.lastIndexOf('/') + 1);
Ross

151

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

console.log(lastSegment);


Können Sie mir erklären, wie es funktioniert? Meines Wissens nach wird .pop () zum Entfernen des letzten Elements eines Arrays verwendet. aber hier ist es das letzte Element meiner URL gezeigt !!
Inspirieren Sie Shahin

1
Split konvertiert Ihre URL in ein Array, wobei jeder Abschnitt der durch '/' begrenzten URL verwendet wird. Daher ist das letzte Segment das letzte Element sowohl der URL als auch des anschließend erstellten Arrays.
Stephen

10
Dies wird nicht funktionieren, wenn die URL mit einem "/" endet, dhhttp://mywebsite/folder/file/
Peter Ludlow

@ PeterLudlow es funktioniert in Chrome 76 können Sie bitte
näher

1
@ PeterLudlow es funktioniert, weil eine leere Zeichenfolge in JS Abstract falsch ist. "" == falseIn diesem Fall wird der Teil des Arrays mit der leeren Zeichenfolge
angezeigt

84
window.location.pathname.split("/").pop()

2
simpel und einfach. Vielen Dank.
Krezaeim

3
Perfekt und ordentlich, großartig
Babak Habibi

1
Schöne und saubere Antwort
Zarkys Salas

1
Genau das habe ich gesucht. Mit React-Router-Dom war dies die sauberste Lösung, die ich gefunden habe, um den letzten Teil der URL hinter dem letzten Schrägstrich zu finden /. console.log(history.location.pathname.split("/").pop()) Wenn es einen besseren Weg gibt, würde ich gerne wissen! Hoffentlich kann dieser Kommentar mehr Menschen zu Ihrer Antwort führen. Danke @ Dblock247
Tralawar

Nebenbemerkung: Dies funktioniert nicht, wenn für die URL Abfrageparameter festgelegt sind (z .../file?var=value&foo=bar. B. ). Diese Lösung löst dieses Problem auf robustere und modernere Weise: stackoverflow.com/a/51795122/1123743
Sebastian Barth

30

Nur eine andere Lösung mit Regex.

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

Ich mag es Danke :).
Salil Sharma

18

Javascript verfügt über die dem Zeichenfolgenobjekt zugeordnete Funktionsaufteilung, die Ihnen helfen kann:

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

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

17

Die anderen Antworten können funktionieren, wenn der Pfad einfach ist und nur aus einfachen Pfadelementen besteht. Aber wenn es auch Abfrageparameter enthält, brechen sie.

Verwenden Sie stattdessen besser ein URL- Objekt, um eine robustere Lösung zu erhalten. Es ist eine analysierte Interpretation der vorliegenden URL:

Eingang: 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);

Ausgabe: 'boo'

Dies funktioniert für alle gängigen Browser. Nur unser sterbender IE unterstützt das nicht (und wird es auch nicht). Für IE gibt es jedoch eine Polyfüllung (wenn Sie sich überhaupt darum kümmern ).



8
var urlChunks = 'mywebsite/folder/file'.split('/');
alert(urlChunks[urlChunks.length - 1]);

5

Ich weiß, es ist zu spät, aber für andere: Ich empfehle dringend , das PURL jquery Plugin zu verwenden . Die Motivation für PURL ist, dass die URL auch nach '#' segmentiert werden kann (Beispiel: angle.js links), dh die URL könnte so aussehen

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

oder

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

Und mit PURL können Sie einfach entscheiden (Segment / Segment), welches Segment Sie erhalten möchten.

Für "klassisches" letztes Segment könnte man schreiben:

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

4

Aufbauend auf Frédérics Antwort, die nur Javascript verwendet:

var url = document.URL

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

3

Ebenfalls,

var url = $(this).attr("href");
var part = url.substring(url.lastIndexOf('/') + 1);

3

Wenn Sie sich keine Sorgen darüber machen, die zusätzlichen Elemente mithilfe der Aufteilung zu generieren, kann der Filter das von Ihnen erwähnte Problem mit dem abschließenden Schrägstrich lösen (vorausgesetzt, Sie haben Browserunterstützung für Filter).

url.split('/').filter(function (s) { return !!s }).pop()

3
// 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);

targetValue = eins

Wenn Ihre URL so aussieht:

http://test.com/one/

oder

http://test.com/one

oder

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

Dann sieht loc wie folgt aus : http://test.com/one

Führen Sie nun, da Sie das letzte Element möchten, den nächsten Schritt aus, um den ursprünglich gewünschten Wert (targetValue) zu laden.

var targetValue = loc.substr(loc.lastIndexOf('/') + 1);

Ich vermisse wahrscheinlich etwas, aber mit " test.com/one " sieht loc wie folgt aus : " test.com ". Ich denke, es sollte so aussehen: if (loc.lastIndexOf ('/') == (loc.length -1)) {loc = loc.substr (0, loc.length-1)} else {var isFile = loc. substr (loc.lastIndexOf ('/'), loc.length) .indexOf ('.')! = -1; if (isFile) loc = loc.substr (0, loc.lastIndexOf ('/')); }
Allan Raquin

Schlägt fehl, wenn ein Schrägstrich searchoder hash.
Walf

3
window.alert(this.pathname.substr(this.pathname.lastIndexOf('/') + 1));

Verwenden Sie die native pathnameEigenschaft, da sie am einfachsten ist und bereits vom Browser analysiert und aufgelöst wurde. $(this).attr("href")kann Werte zurückgeben, ../..die nicht das richtige Ergebnis liefern würden.

Wenn Sie das searchund hash(z. B. foo?bar#bazvon http://quux.com/path/to/foo?bar#baz) verwenden müssen, verwenden Sie Folgendes :

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

Ich möchte auch hinzufügen, dass pathnameAbfrageparameter entfernt werden, dies jedoch hrefnicht.
Max Heiber

3

So rufen Sie das letzte Segment Ihres aktuellen Fensters ab:

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


3

Gibt das letzte Segment zurück, unabhängig von nachgestellten Schrägstrichen:

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

console.log(val);


Sie möchten wahrscheinlich path.sepkeinen wörtlichen Schrägstrich verwenden. Siehe nodejs.org/api/path.html#path_path_sep . Dadurch bleibt Ihr Code für alle Betriebssysteme portierbar.
Aaron

1
Gute Idee, aber es würde nicht mehr im Browser funktionieren
John Doherty

guter Punkt. Ich sollte sagen, dass dies in Befehlszeilenskripten / serverseitigen Knoten bevorzugt wird.
Aaron


2

Sie können zuerst entfernen, ob / am Ende vorhanden ist, und dann den letzten Teil der URL abrufen

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

Raddevus Antwort aktualisiert:

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);

Druckt den letzten Pfad der URL als Zeichenfolge:

test.com/path-name = path-name

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

0

Ich glaube, es ist sicherer, den Schrägstrich ('/') vor dem Teilstring zu entfernen. Weil ich in meinem Szenario eine leere Zeichenfolge habe.

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


0

Ich weiß nicht genau, ob Regex der richtige Weg ist, um dieses Problem zu lösen, da es die Effizienz Ihres Codes wirklich beeinträchtigen kann, aber der folgende Regex hilft Ihnen beim Abrufen des letzten Segments und gibt Ihnen auch dann das letzte Segment, wenn die URL angegeben ist wird von einem leeren gefolgt /. Der Regex, den ich mir ausgedacht habe, ist:

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

0
// 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);

Funktioniert bei mir.


0

Ich weiß, dass es alt ist, aber wenn Sie dies von einer URL erhalten möchten, können Sie einfach verwenden:

document.location.pathname.substring(document.location.pathname.lastIndexOf('/.') + 1);

document.location.pathnameRuft den Pfadnamen von der aktuellen URL ab. lastIndexOfHolen Sie sich den Index des letzten Auftretens des folgenden Regex, in unserem Fall ist /.. Der Punkt bedeutet ein beliebiges Zeichen, daher zählt er nicht, wenn dies /das letzte Zeichen in der URL ist. substringschneidet die Zeichenfolge zwischen zwei Indizes.


0

wenn die URL ist http://localhost/madukaonline/shop.php?shop=79

console.log(location.search); wird bringen ?shop=79

Der einfachste Weg ist also, location.search zu verwenden

Weitere Informationen finden Sie hier und hier


0

Sie können dies mit einfachen Pfaden (w / 0) Querystrings usw. tun.

Zugegeben, wahrscheinlich zu komplex und wahrscheinlich nicht performant, aber ich wollte es reducezum Spaß verwenden.

  "/foo/bar/"
    .split(path.sep)
    .filter(x => x !== "")
    .reduce((_, part, i, arr) => {
      if (i == arr.length - 1) return part;
    }, "");
  1. Teilen Sie die Zeichenfolge auf Pfadtrennzeichen.
  2. Filtern Sie leere Teile des Zeichenfolgenpfads heraus (dies kann durch einen abschließenden Schrägstrich im Pfad geschehen).
  3. Reduzieren Sie das Array der Pfadteile auf den letzten.
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.