Jak uzyskać wartość parametrów URL w JavaScript

Jak uzyskać wartość parametrów URL w JavaScript
W programach JavaScript może istnieć sytuacja, w której istnieje potrzeba dostępu do niektórych danych lub części adresu URL w celu ich wykorzystania zgodnie z własnymi wymaganiami. Na przykład konieczne jest zlokalizowanie danych odnoszących się do odpowiedniego atrybutu. W takich przypadkach technika uzyskania wartości parametrów URL w JavaScript oszczędza dużo czasu i wysiłku.

W tym artykule omówiono metody uzyskania wartości parametrów URL w JavaScript.

Jak uzyskać wartość parametrów URL w JavaScript?

Aby uzyskać wartość parametrów URL w JavaScript, można zastosować następujące podejścia:

  • "podział()„Metoda z„Do" pętla
  • Urlsearchparams" Obiekt

Przejrzyj omawiane metody jeden po drugim!

Metoda 1: Uzyskaj wartość parametrów URL w JavaScript za pomocą metody „split ()” z pętlą „for”

„„podział()„Metoda dzieli dany ciąg na tablicę podłoża bez żadnej zmiany w oryginalnym ciągu. Tę metodę można zastosować do danego adresu URL w dwóch częściach, a do kontrolowania iteracji za pomocą właściwości długości można użyć pętli, aby uzyskać wszystkie wartości parametrów.

Składnia

strunowy.split (separator, limit)

Tutaj, "separator”Odnosi się do ciągu, który należy podzielić i„limit”To liczba reprezentująca podzielone limity.

Sprawdź poniższy przykład zrozumienia określonej koncepcji.

Przykład

W poniższym przykładzie utworzymy przycisk i dołączymy z nim zdarzenie OnClick, które uzyska dostęp do „getParameters ()”Funkcja:

Teraz zdefiniujemy funkcję getParameters (). W swojej definicji dodaje się adres URL przykładowej domeny, do której można uzyskać dostęp i przechowywane w zmiennej o nazwie „Geturl". Następnie określony adres URL zostanie podzielony na dwie części za pomocą „?”Jako separator i„1”Jako limit i„I”Następnie oddzieli każdy ciąg parametrów i przechowuje go w„Params- tablica.

Po tym, "Do„Pętla zostanie zastosowana w taki sposób, aby każdy parametr i jego wartość zostaną wyświetlone na konsoli:

funkcja getParameters ()
niech getUrl = "https: // przykład.com/?produkt = koszule i kolor = biały i użytkownik = anonimowy i size = s ";
Niech getParameters = geturl.podział('?') [1];
letparams = getParameters.podział('&');
dla (niech i = 0; i letValue = params [i].split ('==');
konsola.log (wartość [0], wartość [1]);

Wyjście powyższej implementacji spowoduje następujący sposób:

Chodziło o dostęp do wszystkich wartości parametrów jednocześnie. Jeśli jednak chcesz uzyskać wartość określonego parametru, przejdź do następnej sekcji!

Metoda 2: Uzyskaj wartość parametrów URL w JavaScript z obiektem URLsearchParams

„„Urlsearchparams”Można również wykorzystać do uzyskania określonego adresu URL za pomocą obiektu i pobrania określonej wartości w stosunku do odpowiedniego atrybutu.

Przejrzyj następujący przykład dalszej demonstracji.

Przykład

Najpierw dołącz przycisk z „na kliknięcie„Wydarzenie, które dostęp do określonej funkcji, jak omówiono w poprzedniej metodzie:

Następnie zdefiniowana zostanie funkcja o nazwie urlParameter (). Tutaj nowy obiekt o nazwie „Urlsearchparams”Jest tworzony, który będzie dostępny do określonego adresu URL odnoszącego się do domeny przykładowej. Na koniec wyświetl wszystkie wartości odpowiadające określonym atrybucie. W naszym przypadku,

funkcja urlParameter ()
niech getUrl = new urlsearchparams („https: // przykład.com/?produkt = koszule i kolor = biały i użytkownik = anonimowy i size = s ")
konsola.Log (geturl.GET („Użytkownik”));

Wyjście

W powyższym wyjściu można zaobserwować, że „anonimowy„Wartość jest pobierana dla„użytkownik”Parametr.

Zilustrowaliśmy różne metody uzyskiwania wartości parametrów URL w JavaScript.

Wniosek

Aby uzyskać wartość parametrów URL w JavaScript, użyj „podział()„Metoda z„Do”Pętla, aby podzielić określony adres URL, oddzień każdą wartość parametru i wyświetlić je, dodając wymagany warunek w stosunku do odpowiednich atrybutów. Także „„Urlsearchparams„Metoda obiektu można zastosować do utworzenia nowego obiektu i wyodrębnienia wartości określonego atrybutu. Ten zapis wykazał metody uzyskania wartości parametrów URL w JavaScript.