Jak uzyskać adres URL strony internetowej za pomocą JavaScript

Kiedy opracowujemy aplikację internetową, adresy URL to te, z którymi powszechnie mamy do czynienia. URL to ścieżki potrzebne do przekierowania użytkownika na określoną stronę, a zatem konieczne jest obsługa adresów URL niektórymi konkretnymi metodami. JavaScript ma swoje własne metody uzyskania adresu URL strony, która zwraca wiele przydatnych informacji, takich jak nazwa hosta, ścieżka i zapytanie wewnątrz adresu URL.

Spójrzmy na to w tym artykule.

Co to jest adres URL?

URL (Lokalizator mundurowych zasobów) to ścieżka, która umożliwia dostęp do konkretnej instancji strony internetowej. Przeglądarka rozpoznaje ścieżkę i wyświetla wymaganą stronę internetową na tym adresie URL.

Przed wskoczeniem do URL strony internetowej musimy mieć podstawową wiedzę na temat kilku obiektów, takich jak:

• Obiekt okna
• obiekt lokalizacji
• Obiekt HREF

Miejmy podstawowe zrozumienie każdego z tych obiektów.

Obiekt okna JavaScript

JavaScript używa okno.Lokalizacja.Href Aby uzyskać adres URL strony. Tutaj obiekt okna jest uniwersalnym lub globalnym obiektem, który jest zasadniczo oknem przeglądarki, a ten obiekt okna zawiera wszystkie obiekty, funkcje i zmienne JavaScript.

Obiekt lokalizacji JavaScript

Lokalizacja Obiekt zawiera wszystkie informacje o bieżącym adresie URL strony internetowej, obiekt ten można łatwo uzyskać za pomocą za pomocą okno. Lokalizacja.

JavaScript HREF Obiekt

Href jest właściwością, którą można użyć do ustawiania lub zwrócenia całego adresu URL obecnej strony, nad którą pracujemy. Ta właściwość jest dostępna w ramach okno.Lokalizacja.Href

Rzućmy okiem na cały obiekt i jego aplikacje.

okno.Lokalizacja.Href wyjaśnił

W JavaScript, Lokalizacja Obiekt zawiera informacje o bieżącym adresie URL dokumentu, podczas gdy Okno interfejs służy do do niego dostępu. W rezultacie możesz odzyskać Lokalizacja obiekt bieżącego dokumentu z Okno.Lokalizacja. Następnie wykorzystaj nieruchomość Lokalizacja.Href Aby pobrać ciąg zawierający cały adres URL.

Obecny adres URL pokazany na pasku adresu przeglądarki internetowej można odzyskać za pomocą różnych technik JavaScript. Możesz pobrać te dane za pomocą atrybutu obiektu lokalizacji obiektu okna. Poniżej znajduje się lista niektórych cech obiektu lokalizacji.

Operacje, które możesz wykonać za pomocą JavaScript, są wymienione poniżej.

Przykłady danych URL pobieranych za pomocą Window.Lokalizacja

Weźmy przykład URL „https: // exp.com: 3737/get?post = exp#zapytanie i wykonuj na nim niektóre operacje.

Operacja	Wyniki
okno.Lokalizacja.Href	https: // exp.com: 3737/get?Post = Exp#zapytanie
okno.Lokalizacja.protokół;	HTTPS:
okno.Lokalizacja.gospodarz	przykład.com: 3737
okno.Lokalizacja.Nazwa hosta	do potęgi.com
okno.Lokalizacja.Port	3737
okno.Lokalizacja.nazwa ścieżki	Dostawać
okno.Lokalizacja.zapytanie	?Post = Exp

Wdrożenie przeglądarki

Omówiliśmy powyżej, w jaki sposób możemy łatwo użyć niektórych wbudowanych obiektów JavaScript do odzyskania adresu URL i informacji leżących pod adresem URL, jak nazwa hosta, ścieżka, zapytanie itp. Teraz będziemy praktycznie sprawdzić, jak okno.Lokalizacja.Href Własność działa i jak możemy z niej korzystać, aby dość łatwo uzyskać adres URL strony internetowej.

JavaScript pozwala uzyskać adres URL strony internetowej za pomocą jej okno.Lokalizacja nieruchomość. Możesz po prostu zadzwonić okno.Lokalizacja.Href właściwość, która zwróci Ci pełny adres URL strony internetowej, w tym nazwa hosta, nazwa PathName i zapytanie.

Przetestujmy właściwość JavaScript praktycznie.

Tutaj, w powyższym kodzie, utworzyliśmy przycisk, ten przycisk ma dołączone zdarzenie JavaScript, które jest wyzwalane za każdym razem, gdy przycisk jest klikany przez użytkownika. W wydarzeniu JavaScript wyświetlamy adres URL bieżącej strony w alercie za pomocą okno.Lokalizacja.Href, Ten alert zawiera wiadomość i bieżący adres URL strony internetowej.

Wyjście przeglądarki:

Po kliknięciu przycisku pojawia się alert, który wyświetla adres URL bieżącej strony internetowej:

Tutaj możesz zobaczyć, że użyliśmy okno.Lokalizacja.Href wewnątrz kodu, aby uzyskać adres URL strony i zwrócić go do przeglądarki jako alarm. Więc za każdym razem, gdy klikniesz przycisk „Kliknij mnie”, zobaczysz alert na ekranie z komunikatem zawierającym adres URL bieżącej strony internetowej.

Pobieranie danych URL za pomocą JQuery

Do tej pory omawialiśmy, w jaki sposób możemy łatwo uzyskać adres URL strony internetowej za pomocą JavaScript okno.Lokalizacja.Href właściwość, możemy osiągnąć tę samą funkcjonalność dzięki JQuery, która jest łatwa do wdrożenia i dość niezawodna.

Operacje, które możesz wykonać za pomocą jQuery, są wymienione poniżej.

Weźmy przykład URL „https: // exp.com: 3737/get?post = exp#zapytanie i wykonaj na nim operacje jQuery.

Operacja	Wyniki
$ (lokalizacja).attr („href”);	https: // exp.com: 3737/get?Post = Exp#zapytanie
$ (lokalizacja).attr („protokół”);	HTTPS:
$ (lokalizacja).attr („host”);	przykład.com: 3737
$ (lokalizacja).attr („nazwa hosta”);	do potęgi.com
$ (lokalizacja).attr („port”);	3737
$ (lokalizacja).attr („Pathname”);	Dostawać
$ (lokalizacja).attr („Search”);	?Post = Exp
$ (lokalizacja).attr („hasz”);	#zapytanie
$ (lokalizacja).attr („pochodzenie”);

Wniosek:

W JavaScript, okno.Lokalizacja.Href jest właściwością, której można użyć do odzyskania adresu URL obecnej strony internetowej. Możesz łatwo pobrać bieżący adres URL strony i wykonać dowolną operację, którą chcesz po złapaniu adresu URL. W tym artykule widzieliśmy kilka operacji, które możemy wykonać na adresie URL po jego złapaniu, a także przyjrzeliśmy się, w jaki sposób możemy zaimplementować metodę w naszym kodzie JavaScript, aby osiągnąć funkcjonalność.