Uzyskaj aktualny adres URL za pomocą jQuery?

1828

Korzystam z jQuery. Jak uzyskać ścieżkę bieżącego adresu URL i przypisać go do zmiennej?

Przykładowy adres URL:

http://localhost/menuname.de?foo=bar&amp;number=0

javascript jquery url venkatachalam
źródło

1

można również zobaczyć tech-blog.maddyzone.com/javascript/…

Rituraj ratan

4

Myślę, że pytanie należy przywrócić do pytania o jQuery, ponieważ istnieje na to odpowiedź, niezależnie od tego, czy jQuery jest wymagane do wykonania zadania.

goodeye

1

możliwy duplikat Pobierz bieżący adres URL za pomocą JavaScript?

vimal1083

3

@goodeye Nie, nie ma sposobu jQuery, aby uzyskać lokalizację; od narzędzia do śledzenia błędów jQuery: »Być może działało, ale nigdy nie było obsługiwane ani dokumentowane. Wystarczy użyć document.location.href, który jest szybszy, prostszy i łatwiejszy do zrozumienia. «Innymi słowy, niektórzy ludzie używali jQuery, aby uzyskać lokalizację, ale polegali raczej na błędzie niż na funkcji. Zobacz: bugs.jquery.com/ticket/7858

chargeela

2518

Aby uzyskać ścieżkę, możesz użyć:

var pathname = window.location.pathname; // Returns path only (/path/example.html)
var url      = window.location.href;     // Returns full URL (https://example.com/path/example.html)
var origin   = window.location.origin;   // Returns base URL (https://example.com)

Ryan Doherty
źródło

79

Właściwości obiektu lokalizacji: developer.mozilla.org/en/DOM/window.location

bentford

100

JQuery daleki od zabicia go, dał Javascript nowe życie. Czy nowi programiści C # / Java rozumieją wskaźniki? Nie. Czy muszą? Niezupełnie, nowsze abstrakcje są wystarczająco potężne, aby nie miało to znaczenia ...

ciało

199

„Jak XYZ w jQuery”, a odpowiedź jest prosta: javascript jest dość powszechny. Możesz wiedzieć, jak zrobić coś w zwykłym javascript; jednak ze względu na niespójności przeglądarki możesz to zrobić w sposób „jQuery”. Pamiętam pre-jQuery lub framework Najpierw sprawdziłem przeglądarkę, a następnie robiłem to, co chciałem na kilka sposobów. Podobnie jak jQuery zabija zwykłego js ... tak, dzięki Bogu, ale także czyni go użytecznym.

Parris,

9

to nie działa dla pełnego adresu URL. na przykład. dla „ mail.google.com/mail/u/0/#mbox/13005b79fe72f448 ” zwróci to tylko / mail / u / 0

dwaynemac

12

Ummm, ... window.location.pathname pobiera adres URL tylko do „?” i nie otrzymuje parametrów zapytania, jak zadano w pytaniu.

johntrepreneur

816

W czystym stylu jQuery:

$(location).attr('href');

Obiekt lokalizacji ma również inne właściwości, takie jak host, skrót, protokół i nazwa ścieżki.

Boris Guéry
źródło

52

Najwyraźniej użycie $ (lokalizacja) w jQuery jest nieobsługiwane i odradzane: bugs.jquery.com/ticket/7858

Peter

10

@Peter Błąd zamknięty jako nieprawidłowy.

kevinji,

21

@ mc10: Część „niepoprawna” dotyczy prośby o wsparcie $ (lokalizacja); NIE należy tego używać.

Peter

6

Ta odpowiedź nie jest potrzebna, a pytanie i odpowiedź można zaktualizować, aby nie używać jquery. Powody można znaleźć tutaj bugs.jquery.com/ticket/7858#comment:4

Vishwanath,

8

@HaralanDobrev: Powinieneś nie być w stanie zrobić .attr()na miejscu. (1) To nie jest element, więc $(location)jest co najwyżej zacieniony, i (2) nawet jeśli zadziałało, powinieneś użyć, .prop()aby uzyskać właściwości. .attr()dotyczy atrybutów HTML.

cHao

471

http://www.refulz.com:8082/index.php#tab2?foo=789

Property    Result
------------------------------------------
host        www.refulz.com:8082
hostname    www.refulz.com
port        8082
protocol    http:
pathname    index.php
href        http://www.refulz.com:8082/index.php#tab2
hash        #tab2
search      ?foo=789

var x = $(location).attr('<property>');

Działa to tylko wtedy, gdy masz jQuery. Na przykład:

<html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script>
  $(location).attr('href');      // http://www.refulz.com:8082/index.php#tab2
  $(location).attr('pathname');  // index.php
</script>
</html>

Rizon
źródło

13

To samo wytłumaczenie, co poprzednie, ale z całym elementem obiektu. Świetna odpowiedź.

Oskar Calvo

4

Powinien być /index.phpzamiast index.phpnazwy ścieżki.

Andrea

4

+1 jQuery jest najlepszym kodem jakości, jeśli nie używasz go jako idiota. jQuery to zdecydowanie najlepsza droga. </sarcasm>

Oriol

2

Według bugs.jquery.com/ticket/7858 działa to tylko przez przypadek. Ponadto, attrma być wykorzystywane wyłącznie na DOM obiektów, za rzeczy, które można ustawić za pomocą atrybutów HTML.

MauganRa

69

Jeśli potrzebujesz parametrów skrótu obecnych w adresie URL, window.location.hrefmoże być lepszym wyborem.

window.location.pathname
=> /search

window.location.href 
 => www.website.com/search#race_type=1

jlfenaux
źródło

3

Jeśli ktoś potrzebuje tylko skrótu, może wywołać window.location.href

Amit Patel

15

Myślę, że @AmitPatel oznaczawindow.location.hash

ptim

53

Będziesz chciał użyć wbudowanego window.locationobiektu JavaScript .

pazur
źródło

3

to nie zwróci pozycji po „?” w miejscu.

Majid

@majidgeek działa dla mnie w Firefox, Chrome i IE. Czy możesz podać przypadek testowy tego zerwania?

Barney,

3

może potwierdzić przynajmniej w konsoli, window.location.pathnamektóra niczego nie odzyskuje po?

worc

45

Wystarczy dodać tę funkcję w JavaScript, a zwróci bezwzględną ścieżkę bieżącej ścieżki.

function getAbsolutePath() {
    var loc = window.location;
    var pathName = loc.pathname.substring(0, loc.pathname.lastIndexOf('/') + 1);
    return loc.href.substring(0, loc.href.length - ((loc.pathname + loc.search + loc.hash).length - pathName.length));
}

Mam nadzieję, że to zadziała dla ciebie.

Neville Bonavia
źródło

1

Pomogło to doskonale w przypadku skryptu, w którym leniwie miałem podstawowe zakodowane adresy URL. Wolę nie mieć końcowego „/” w katalogu głównym i wstawiać go do ścieżki, więc właśnie zrobiłem drugą linięvar pathName = loc.pathname.substring(0, loc.pathname.lastIndexOf('/'));

cogdog

40

window.location to obiekt w javascript. zwraca następujące dane

window.location.host          #returns host
window.location.hostname      #returns hostname
window.location.path          #return path
window.location.href          #returns full current url
window.location.port          #returns the port
window.location.protocol      #returns the protocol

w jquery możesz użyć

$(location).attr('host');        #returns host
$(location).attr('hostname');    #returns hostname
$(location).attr('path');        #returns path
$(location).attr('href');        #returns href
$(location).attr('port');        #returns port
$(location).attr('protocol');    #returns protocol

Gauraw
źródło

1

co windo.location.origin?

Ali Sheikhpour,

30

Jest to bardziej skomplikowana kwestia, niż wielu może myśleć. Kilka przeglądarek obsługuje wbudowane obiekty lokalizacji JavaScript i powiązane parametry / metody dostępne za pośrednictwem window.locationlub document.location. Jednak różne wersje Internet Explorera (6,7) nie obsługują tych metod w ten sam sposób, ( window.location.href? window.location.replace() Nieobsługiwany), więc musisz mieć do nich różny dostęp, pisząc cały czas kod warunkowy, aby trzymać Internet Explorera.

Tak więc, jeśli masz dostępne i załadowane jQuery, równie dobrze możesz użyć jQuery (lokalizacja), jak inni wspomniani, ponieważ rozwiązuje te problemy. Jeśli jednak przykładowo przekierowujesz geolokalizację po stronie klienta za pomocą JavaScript (to znaczy, używając interfejsu API Map Google i metod obiektu lokalizacji), możesz nie chcieć załadować całej biblioteki jQuery i napisać kod warunkowy, który sprawdza każdą wersję przeglądarki Internet Explorer / Firefox / itp.

Internet Explorer sprawia, że front-end kot jest niezadowolony, ale jQuery to talerz mleka.

negutron
źródło

Dodatkowo: bugs.jquery.com/ticket/8138 . W źródle jQuery 1.8.0 znajduje się komentarz: // # 8138, IE może zgłosić wyjątek podczas uzyskiwania dostępu do // pola z window.location, jeśli ustawiono document.domain.

Jan Święcki

28

Tylko dla nazwy hosta użyj:

window.location.hostname

Mahmoud Farahat
źródło

24

Skrypt java udostępnia wiele metod pobierania bieżącego adresu URL wyświetlanego w pasku adresu przeglądarki.

Testowy adres URL:

http://
stackoverflow.com/questions/5515310/get-current-url-with-jquery/32942762
?
rq=1&page=2&tab=active&answertab=votes
#
32942762

resourceAddress.hash();
console.log('URL Object ', webAddress);
console.log('Parameters ', param_values);

Funkcjonować:

var webAddress = {};
var param_values = {};
var protocol = '';
var resourceAddress = {

    fullAddress : function () {
        var addressBar = window.location.href;
        if ( addressBar != '' && addressBar != 'undefined') {
            webAddress[ 'href' ] = addressBar;
        }
    },
    protocol_identifier : function () { resourceAddress.fullAddress();

        protocol = window.location.protocol.replace(':', '');
        if ( protocol != '' && protocol != 'undefined') {
            webAddress[ 'protocol' ] = protocol;
        }
    },
    domain : function () {      resourceAddress.protocol_identifier();

        var domain = window.location.hostname;
        if ( domain != '' && domain != 'undefined' && typeOfVar(domain) === 'string') {
            webAddress[ 'domain' ] = domain;
            var port = window.location.port;
            if ( (port == '' || port == 'undefined') && typeOfVar(port) === 'string') {
                if(protocol == 'http') port = '80';
                if(protocol == 'https') port = '443';           
            }
            webAddress[ 'port' ] = port;
        }
    },
    pathname : function () {        resourceAddress.domain();

        var resourcePath = window.location.pathname;
        if ( resourcePath != '' && resourcePath != 'undefined') {
            webAddress[ 'resourcePath' ] = resourcePath;
        }
    },
    params : function () {      resourceAddress.pathname();

        var v_args = location.search.substring(1).split("&");

        if ( v_args != '' && v_args != 'undefined')
        for (var i = 0; i < v_args.length; i++) {
            var pair = v_args[i].split("=");

            if ( typeOfVar( pair ) === 'array' ) {
                param_values[ decodeURIComponent( pair[0] ) ] = decodeURIComponent( pair[1] );
            }
        }
        webAddress[ 'params' ] = param_values;
    },
    hash : function () {        resourceAddress.params();

        var fragment = window.location.hash.substring(1);
        if ( fragment != '' && fragment != 'undefined')
            webAddress[ 'hash' ] = fragment;        
    }
};
function typeOfVar (obj) {
      return {}.toString.call(obj).split(' ')[1].slice(0, -1).toLowerCase();
}

protokół « Przeglądarki internetowe używają protokołu internetowego, przestrzegając niektórych zasad komunikacji między aplikacjami WebHosted a klientem WWW (przeglądarką). (http = 80 , https (SSL) = 443 , ftp = 21 itd.)

EX: Z domyślnymi numerami portów

<protocol>//<hostname>:<port>/<pathname><search><hash>
https://en.wikipedia.org:443/wiki/Pretty_Good_Privacy
http://stackoverflow.com:80/

(//) «Host to nazwa nadana punktowi końcowemu (maszynie, na której znajduje się zasób) w Internecie. www.stackoverflow.com - DNS Adres IP aplikacji (OR) localhost: 8080 - localhost

Nazwy domen są rejestrowane zgodnie z zasadami i procedurami drzewa systemu nazw domen (DNS). Serwery DNS osoby, która zarządza Twoją domeną za pomocą adresu IP do celów adresowania. W hierarchii serwerów DNS nazwą roota stackoverlfow.com jest com.

gTLDs      - com « stackoverflow (OR) in « co « google

System lokalny musisz utrzymywać domeny, które nie są PUBLICZNE w plikach hosta. localhost.yash.com « localhsot - subdomain(web-server), yash.com - maindomain(Proxy-Server). myLocalApplication.com 172.89.23.777

(/) «Ścieżka zawiera informacje o konkretnym zasobie w hoście, do którego klient sieciowy chce uzyskać dostęp
(?) «Opcjonalnym zapytaniem jest przekazanie sekwencji par atrybut-wartość oddzielonych separatorem (&).
(#) «Opcjonalny fragment jest często atrybutem id określonego elementu, a przeglądarki internetowe przewijają ten element do widoku.

Jeśli parametr ma epokę, ?date=1467708674 użyj.

var epochDate = 1467708674; var date = new Date( epochDate );

URL

Adres URL uwierzytelnienia z nazwą użytkownika: hasło, Jeśli nazwa użytkownika / hasło zawiera symbol @,
taki jak:

Username = `my_email@gmail`
Password = `Yash@777`

następnie musisz zakodować adres URL @jako %40. ^{Odnosić się...}

http://my_email%40gmail.com:Yash%[email protected]_site.com

encodeURI()(vs) encodeURIComponent()przykład

var testURL = "http:my_email@gmail:Yash777@//stackoverflow.com?tab=active&page=1#32942762";

var Uri = "/:@?&=,#", UriComponent = "$;+", Unescaped = "(-_.!~*')"; // Fixed
var encodeURI_Str = encodeURI(Uri) +' '+ encodeURI( UriComponent ) +' '+ encodeURI(Unescaped);
var encodeURIComponent_Str =  encodeURIComponent( Uri ) +' '+ encodeURIComponent( UriComponent ) +' '+ encodeURIComponent( Unescaped );
console.log(encodeURI_Str, '\n', encodeURIComponent_Str);
/*
 /:@?&=,# +$; (-_.!~*') 
 %2F%3A%40%3F%26%3D%2C%23 %2B%24%3B (-_.!~*')
*/

Yash
źródło

23

Będzie to również działać:

var currentURL = window.location.href;

Suresh Pattu
źródło

Daje to pełny adres URL, którego szuka większość osób.

Kemal

19

Możesz zalogować window.location i zobaczyć wszystkie opcje, używając tylko adresu URL:

window.location.origin

dla całej ścieżki użyj:

window.location.href

jest też lokalizacja. _ _

.host
.hostname
.protocol
.pathname

dacopenhagen
źródło

Nie należy go używać, ponieważ location.origin nie działa w Internet Explorerze

Jacek Kolasa

15

Zwróci bezwzględny adres URL bieżącej strony przy użyciu JavaScript / jQuery .

document.URL
$("*").context.baseURI
location.href

Riyaz Hameed
źródło

13

Jeśli jest ktoś, kto chce połączyć URL i tag skrótu, połącz dwie funkcje:

var pathname = window.location.pathname + document.location.hash;

Nis
źródło

Aby wyjaśnić: w ogóle nie musisz używać jQuery, powyższa funkcja javascript zwróci to, o co prosił OP?

GHC

12

Mam to, aby usunąć zmienne GET.

var loc = window.location;
var currentURL = loc.protocol + '//' + loc.host + loc.pathname;

Aram Kocharyan
źródło

12

Możesz po prostu pobrać swoją ścieżkę, używając samego js, window.locationlub locationda ci obiekt bieżącego adresu URL

console.log("Origin - ",location.origin);
console.log("Entire URL - ",location.href);
console.log("Path Beyond URL - ",location.pathname);

Rozwiń fragment kodu

Mohideen bin Mohammed
źródło

11

 var currenturl = jQuery(location).attr('href');

Hari Maliya
źródło

11

Aby uzyskać adres URL okna nadrzędnego z poziomu elementu iframe:

$(window.parent.location).attr('href');

Uwaga: działa tylko w tej samej domenie

Costa
źródło

11

Oto przykład, aby uzyskać bieżący adres URL za pomocą jQuery i JavaScript:

$(document).ready(function() {

    //jQuery
    $(location).attr('href');

    //Pure JavaScript
    var pathname = window.location.pathname;

    // To show it in an alert window
    alert(window.location);
});


$.getJSON("idcheck.php?callback=?", { url:$(location).attr('href')}, function(json){
    //alert(json.message);
});

Peter Mortensen
źródło

10

Poniżej znajdują się przykłady użytecznych fragmentów kodu, których można użyć - niektóre przykłady wykorzystują standardowe funkcje JavaScript i nie są specyficzne dla jQuery:

Zobacz 8 Przydatnych fragmentów jQuery dla adresów URL i kwerend .

Issamovitch
źródło

10

Użyj window.location.href . Otrzymasz pełny adres URL .

Saikumar Anireddy
źródło

9

window.location poda ci bieżący adres URL i możesz z niego wyodrębnić, co tylko chcesz ...

ZMR BINU
źródło

9

Zobacz purl.js . To naprawdę pomoże i może być również użyte, w zależności od jQuery. Użyj tego w ten sposób:

$.url().param("yourparam");

Chuanshi Liu
źródło

8

Jeśli chcesz uzyskać ścieżkę do strony głównej, użyj tego:

$(location).attr('href').replace($(location).attr('pathname'),'');

Vikas Mehta
źródło

1

nie byłoby to .replace('#.*', '')? Usunąć nie tylko znak skrótu, ale wszystko po nim?

Jonas Kölker,

8

Bardzo często używane 3 najlepsze

1. window.location.hostname 
2. window.location.href
3. window.location.pathname

Nitish Kumar Pal
źródło

8

var path = location.pathnamezwraca ścieżkę bieżącego adresu URL (jQuery nie jest potrzebne). Zastosowanie window.locationjest opcjonalne.

Jonathan Lin
źródło

8

Wszystkie przeglądarki obsługują obiekt okna JavaScript. Określa okno przeglądarki.

Globalne obiekty i funkcje stają się automatycznie częścią obiektu okna.

Wszystkie zmienne globalne są właściwościami obiektów okien, a wszystkie funkcje globalne są jego metodami.

Cały dokument HTML jest również własnością okna.

Możesz więc użyć obiektu window.location, aby uzyskać wszystkie atrybuty związane z adresem URL.

JavaScript

console.log(window.location.host);     //returns host
console.log(window.location.hostname);    //returns hostname
console.log(window.location.pathname);         //return path
console.log(window.location.href);       //returns full current url
console.log(window.location.port);         //returns the port
console.log(window.location.protocol)     //returns the protocol

Rozwiń fragment kodu

JQuery

console.log("host = "+$(location).attr('host'));
console.log("hostname = "+$(location).attr('hostname'));
console.log("pathname = "+$(location).attr('pathname')); 
console.log("href = "+$(location).attr('href'));   
console.log("port = "+$(location).attr('port'));   
console.log("protocol = "+$(location).attr('protocol'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

Rozwiń fragment kodu

Sumesh TG
źródło

1

Rozumiem, location.pathnamegdzie używasz location.path- czy ta odpowiedź wymaga aktualizacji?

Edward

@ Edward Zaktualizowano

Sumesh TG

7

var newURL = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname;

Hema Ganapathy
źródło

2

powinieneś dodać wyjaśnienie do swojej odpowiedzi.

Raptor

5

// get current URL

$(location).attr('href');
var pathname = window.location.pathname;
alert(window.location);

Ayan Chakraborty
źródło

4

W jstl możemy uzyskać dostęp do bieżącej ścieżki URL za pomocą pageContext.request.contextPath, jeśli chcesz wykonać wywołanie ajax,

  url = "${pageContext.request.contextPath}" + "/controller/path"

Np .: na stronie http://stackoverflow.com/questions/406192to dahttp://stackoverflow.com/controller/path

Maleen Abewardana
źródło

Uzyskaj aktualny adres URL za pomocą jQuery?

Odpowiedzi: