Czy masz aktualny adres URL z JavaScript?

3002

Chcę tylko uzyskać adres URL witryny. Nie adres URL pobrany z linku. Podczas ładowania strony muszę być w stanie pobrać pełny, aktualny adres URL witryny i ustawić go jako zmienną odpowiadającą moim potrzebom.

javascript url Peter Mortensen
źródło

2

Możliwe duplikaty: Uzyskaj protokół, domenę i port z adresu URL

blong

1

stackoverflow.com/questions/406192/…

Nilesh Botre

3681

Posługiwać się:

window.location.href

Jak zauważono w komentarzach, poniższy wiersz działa, ale jest on nieprawidłowy dla przeglądarki Firefox.

document.URL;

Zobacz adres URL typu DOMString, tylko do odczytu .

Peter Mortensen
źródło

142

W przeglądarce Firefox 12 document.URLwłaściwość nie aktualizuje się po window.locationzakotwiczeniu (#), a window.location.hrefrobi to. Przygotowałem tutaj demo na żywo: jsfiddle.net/PxgKy Nie testowałem żadnych innych wersji Firefoksa. document.URLW Chrome 20 i IE9 nie znaleziono problemów z używaniem .

Telmo Marques,

88

możesz także uzyskać hosta i wyczyścić lokalizację: window.location.hostiwindow.location.href.toString().split(window.location.host)[1]

Ali Youhannaei

8

a co document.baseURIwtedy. Zasadniczo istnieją 3 sposoby, aby uzyskać adres URL document.baseURI, document.URL, i location.

Muhammad Umer

20

-1: Jeśli masz ramkę, obraz lub formularz, name="URL"ta właściwość zostanie zacieniona na documentobiekcie, a kod się zepsuje. W takim przypadku document.URLbędzie odwoływał się do węzła DOM. Lepiej używać właściwości obiektu globalnego jak w window.location.href.

Roy Tinker,

13

„window.location.href” dla zwycięstwa

GabrielBB

663

Dostęp do informacji o adresie URL

JavaScript zapewnia wiele metod pobierania i zmiany bieżącego adresu URL, który jest wyświetlany w pasku adresu przeglądarki. Wszystkie te metody wykorzystują Locationobiekt, który jest własnością Windowobiektu. Możesz utworzyć nowy Locationobiekt, który ma bieżący adres URL w następujący sposób:

var currentLocation = window.location;

Podstawowa struktura adresów URL

<protocol>//<hostname>:<port>/<pathname><search><hash>

protokół: Określa nazwę protokołu używaną do uzyskania dostępu do zasobu w Internecie. (HTTP (bez SSL) lub HTTPS (z SSL))
nazwa hosta: nazwa hosta określa hosta, który jest właścicielem zasobu. Na przykład www.stackoverflow.com. Serwer świadczy usługi przy użyciu nazwy hosta.
port: numer portu używany do rozpoznania określonego procesu, do którego ma zostać przekazany Internet lub inna wiadomość sieciowa, gdy dotrze na serwer.
nazwa ścieżki: ścieżka zawiera informacje o konkretnym zasobie na hoście, do którego klient sieciowy chce uzyskać dostęp. Na przykład /index.html.
wyszukiwanie: ciąg zapytania odpowiada komponentowi ścieżki i zawiera ciąg informacji, które zasób może wykorzystać do określonego celu (na przykład jako parametry wyszukiwania lub dane do przetworzenia).
hash: zakotwiczona część adresu URL zawiera znak skrótu (#).

Dzięki tym Locationwłaściwościom obiektu możesz uzyskać dostęp do wszystkich tych składników URL oraz tego, co mogą ustawić lub zwrócić:

href - cały adres URL
protokół - protokół adresu URL
host - nazwa hosta i port adresu URL
nazwa hosta - nazwa hosta adresu URL
Port - numer portu, którego serwer używa dla adresu URL
nazwa ścieżki - nazwa ścieżki adresu URL
Szukaj - część zapytania dotycząca adresu URL
haszysz - zakotwiczona część adresu URL

Mam nadzieję, że dostałeś swoją odpowiedź ..

Nikhil Agrawal
źródło

7

Oni nie są „metody” o window.location, ale właściwości, a tutaj mamy przykład : var stringPathName = window.location.pathname.

Peter Krauss

@FabioC. Możesz go usunąć przez substring. Może się jednak przydać, gdy chcesz użyć przekierowania, document.location = "/page.html";aby przekierować na stronę głównąpage.html

FindOut_Quran,

1

To więcej niż tylko postawione pytanie. Prawdę mówiąc, szukałem prawdopodobnie około miesiąca temu, aby znaleźć dobry sposób na wydobycie jednej lub więcej określonych części z ciągu adresu URL (myślę, że prawdopodobnie była to bieżąca strona, którą próbowałem uzyskać), i chociaż inne pytania dotyczyły bardziej - cel, ich odpowiedzi nie były tak użyteczne i proste w tym celu jak ten.

Panzercrisis

1

Jedna szybka sugestia: w podstawowej strukturze adresu URL opisanej powyżej jest miejsce na search, ale na poniższej liście opisów nazywa się to query. Być może można je pogodzić lub dodać dodatkowe wyjaśnienia.

Panzercrisis

1

Nazywa się to „wyszukiwanie”, a nie „zapytanie”

Apollo Data

320

Służy window.locationdo dostępu do odczytu i zapisu do obiektu lokalizacji powiązanego z bieżącą ramką. Jeśli chcesz tylko uzyskać adres jako ciąg tylko do odczytu, możesz użyć document.URL, który powinien zawierać taką samą wartość jak window.location.href.

Christoph
źródło

19

patrz także stackoverflow.com/questions/2430936/…

Christoph

264

Pobiera bieżący adres URL strony:

window.location.href

Zanoni
źródło

3

Zauważ, że to lokalizacja okna, a nie dokumentu.

Gumbo

16

To jest to samo. Pełny aktualny adres URL odnosi się do ścieżki dokumentu (adres zewnętrzny).

Zanoni

2

Czy jest znormalizowany jak document.url? (Mam na myśli coś w rodzaju dokumentu w3c)

chendral

documentjest korzeniem drzewa dokumentu zdefiniowanego przez specyfikację. windowjest ogólnie równoważny, ale może nie być w dziwnych okolicznościach.

broinjc,

57

OK, uzyskanie pełnego adresu URL bieżącej strony jest łatwe przy użyciu czystego JavaScript. Na przykład wypróbuj ten kod na tej stronie:

window.location.href;
// use it in the console of this page will return
// http://stackoverflow.com/questions/1034621/get-current-url-in-web-browser"

window.location.hrefWłaściwość zwraca adres URL bieżącej strony.

document.getElementById("root").innerHTML = "The full URL of this page is:<br>" + window.location.href;

<!DOCTYPE html>
<html>

<body>
  <h2>JavaScript</h2>
  <h3>The window.location.href</h3>
  <p id="root"></p>
</body>

</html>

Rozwiń fragment kodu

Nie wspominając o nich również:

jeśli potrzebujesz ścieżki względnej, po prostu użyj window.location.pathname;
jeśli chcesz uzyskać nazwę hosta, możesz użyć window.location.hostname;
a jeśli potrzebujesz uzyskać protokół osobno, użyj window.location.protocol
- również, jeśli strona ma hashznacznik, można uzyskać to lubią: window.location.hash.

Więc window.location.hrefobsługuje wszystko naraz ... w zasadzie:

window.location.protocol + '//' + window.location.hostname + window.location.pathname + window.location.hash === window.location.href;
    //true

Również za pomocą window nie jest potrzebne, jeśli jest już w zakresie okna ...

W takim przypadku możesz użyć:

location.protocol

location.hostname

location.pathname

location.hash

location.href

Alireza
źródło

window.location.protocol + '//' + window.location.hostname + window.location.pathname + window.location.hash === window.location.href; nie zawsze jest prawdą! window.location.pathname brakuje parametrów GET.

AssassiN

40

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

console.log('document.location', document.location.href);
console.log('location.pathname',  window.location.pathname); // Returns path only
console.log('location.href', window.location.href); // Returns full URL

Rozwiń fragment kodu

Sangeet Shah
źródło

35

Otwórz Narzędzia programistyczne , wpisz następujące polecenie w konsoli i naciśnij klawisz Enter .

window.location

Np .: poniżej zrzut ekranu wyniku na bieżącej stronie.

Chwyć to, czego potrzebujesz stąd. :)

thh
źródło

29

Zastosowanie: window.location.href.

Jak wspomniano powyżej, document.URL nie aktualizuje się podczas aktualizacji window.location. Zobacz MDN .

dorycki
źródło

21

Użyj, window.location.hrefaby uzyskać pełny adres URL.
Służy window.location.pathnamedo tego, aby adres URL opuszczał hosta.

Kishore
źródło

4

window.location.pathname nie obejmuje zapytania ani fragmentu skrótu

OMGPOP,

17

Bieżącą lokalizację adresu URL można uzyskać za pomocą znacznika skrótu , używając:

JavaScript:

 // Using href
 var URL = window.location.href;

 // Using path
 var URL = window.location.pathname;

jQuery :

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

Bhaskar Bhatt
źródło

10

var currentPageUrlIs = "";
if (typeof this.href != "undefined") {
       currentPageUrlIs = this.href.toString().toLowerCase(); 
}else{ 
       currentPageUrlIs = document.location.toString().toLowerCase();
}

Powyższy kod może również komuś pomóc

Rohan Patil
źródło

2

Zastosowałeś metodę .toLowerCase () do adresu URL, który faktycznie ją zmienia. W niektórych serwerach rozróżniana jest

wielkość

Powinieneś używać słowa window.href. Ten kod działa tylko w kontekście, w którym to okno ===, ale nie zawsze tak może być, szczególnie jeśli ktoś wkleił to rozwiązanie.

deadboy

W przypadku niektórych „serwerów” rozróżniana jest wielkość liter. To NAJBARDZIEJ serwery. Zgadzam się więc z AnthonyVO: zmiana wielkości liter w adresie URL jest bardzo złym pomysłem.

mivk

Nie możesz toLowerCase () adresu URL, upewniając się, że go nie złamie !!! Jeśli URL jest http://www.server.com/path/to/Script.php?option=A1B2C3, jeśli w systemie plików rozróżniana jest wielkość liter (Linux / Unix), niekoniecznie muszą być takie same Script.php i script.php. I nawet jeśli nie rozróżnia wielkości liter (Windows, niektóre Mac OS), ?option=A1B2C3to nie to samo ?option=a1b2c3, a nawet ?Option=A1B2C3. Tylko serwer nie rozróżnia wielkości liter: www.server.com lub www.SeRvEr.cOm są takie same.

FrancescoMM,

8

Dodanie wyniku do szybkiego odniesienia

window.location;

 Location {href: "/programming/1034621/get-the-current-url-with-javascript",
 ancestorOrigins: DOMStringList,
 origin: "https://stackoverflow.com",
 replace: ƒ, assign: ƒ, …}

document.location

  Location {href: "/programming/1034621/get-the-current-url-with-javascript", 
ancestorOrigins: DOMStringList,
 origin: "https://stackoverflow.com",
 replace: ƒ, assign: ƒ
, …}

window.location.pathname

"/questions/1034621/get-the-current-url-with-javascript"

window.location.href

"/programming/1034621/get-the-current-url-with-javascript"

location.hostname

"stackoverflow.com"

Hitesh Sahu
źródło

7

Aby uzyskać pełny adres URL z ciągami zapytań:

document.location.toString().toLowerCase();

W przypadku adresu URL hosta:

window.location

Syed Nasir Abbas
źródło

11

Zastosowałeś metodę .toLowerCase () do adresu URL, który faktycznie ją zmienia. W niektórych serwerach rozróżniana jest

wielkość

Jak już powiedziano, nie można toLowerCase () adresu URL, upewniając się, że go nie złamie !!! Jeśli adres URL to server.com/path/to/Script.php?option=A1B2C3 , jeśli w systemie plików rozróżniana jest wielkość liter (Linux / Unix) niekoniecznie są takie same Script.php i script.php. I nawet jeśli nie rozróżnia wielkości liter (Windows, niektóre Mac OS), opcja? = A1B2C3 nie jest tym samym co opcja? = A1b2c3, a nawet? Opcja = A1B2C3. Tylko serwer nie rozróżnia wielkości liter: www.server.com lub www.SeRvEr.cOm są takie same.

FrancescoMM,

Dziękuję AnthonyVO za wskazanie tego. Możemy użyć tylko document.location.toString (), aby uzyskać pełny adres URL. toLowerCase () miał porównać jak skrypt w skrypcie indexOf.

Syed Nasir Abbas

4

W jstl możemy uzyskać dostęp do bieżącej ścieżki URL za pomocą pageContext.request.contextPath. Jeśli chcesz wykonać połączenie Ajax, użyj następującego adresu URL.

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

Przykład: dla strony http://stackoverflow.com/posts/36577223to da http://stackoverflow.com/controller/path.

Maleen Abewardana
źródło

4

Sposób uzyskania bieżącego obiektu lokalizacji to window.location .

Porównaj to document.location, co pierwotnie zwróciło tylko bieżący adres URL jako ciąg. Prawdopodobnie, aby uniknąć zamieszania, document.locationzostał zastąpiony przezdocument.URL .

I wszystkie nowoczesne przeglądarki map document.locationdowindow.location .

W rzeczywistości dla bezpieczeństwa w różnych przeglądarkach powinieneś używać window.locationzamiast document.location.

Josip Ivic
źródło

3

Dla tych, którzy chcą rzeczywistego obiektu URL, potencjalnie dla narzędzia, które przyjmuje adresy URL jako argument:

const url = new URL(window.location.href)

https://developer.mozilla.org/en-US/docs/Web/API/URL

Seph Reed
źródło

3

Odpowiedź Nikhila Agrawala jest świetna, wystarczy dodać tutaj mały przykład, który możesz zrobić w konsoli, aby zobaczyć różne komponenty w akcji:

Jeśli chcesz, aby podstawowy adres URL bez ścieżki lub parametru zapytania (na przykład do wykonywania żądań AJAX przeciwko działał zarówno na serwerach programistycznych / testowych ORAZ, jak i serwerach produkcyjnych), window.location.originnajlepiej jest zachować protokół i opcjonalny port (w rozwoju Django czasami mieć niestandardowy port, który go zepsuje, jeśli użyjesz nazwy hosta itp.)

Dane Apollo
źródło

0

   location.origin+location.pathname+location.search+location.hash;

زياد
źródło

0

Możesz uzyskać pełny link bieżącej strony, location.href a aby uzyskać link do bieżącego kontrolera, użyj:

location.href.substring(0, location.href.lastIndexOf('/'));

Khaled Harby
źródło

0

Uzyskiwanie bieżącego adresu URL za pomocą JavaScript:

window.location.toString ();

window.location.href

Hasib Kamal
źródło

0

jeśli odwołujesz się do konkretnego linku, który ma identyfikator, ten kod może ci pomóc.

$(".disapprove").click(function(){
    var id = $(this).attr("id");

    $.ajax({
        url: "<?php echo base_url('index.php/sample/page/"+id+"')?>",
        type: "post",
        success:function()
        {
            alert("The Request has been Disapproved");
            window.location.replace("http://localhost/sample/page/"+id+"");
        }
    });
});

Korzystam z ajax tutaj, aby przesłać identyfikator i przekierować stronę za pomocą window.location.replace . po prostu dodaj atrybut, id=""jak podano.

ciekawość
źródło

0

Próbować

location+''

Pokaż fragment kodu

let url = location+'';

console.log(url);

Rozwiń fragment kodu

Kamil Kiełczewski
źródło

-2

Najpierw sprawdź, czy strona jest całkowicie załadowana

browser,window.location.toString();

window.location.href

następnie wywołaj funkcję, która pobiera adres URL, zmienną URL i drukuje na konsoli,

$(window).load(function(){
   var url = window.location.href.toString();
   var URL = document.URL;
   var wayThreeUsingJQuery = $(location).attr('href');
   console.log(url);
   console.log(URL);
   console.log(wayThreeUsingJQuery );
});

Ashish Kamble
źródło

Czy masz aktualny adres URL z JavaScript?

Odpowiedzi: