Ten blog zdefiniuje procedurę uzyskiwania wartości ciągu zapytania w JavaScript.
Jak uzyskać wartości ciągu zapytania w JavaScript?
Aby uzyskać wartości ciągu zapytania w JavaScript, użyj następujących metod:
- Użyj interfejsu API adresu URL z metodą get()
- URLSearchParams metodą get().
- URLSearchParams za pomocą metody values().
Metoda 1: Uzyskanie wartości ciągu zapytania przy użyciu interfejsu API adresu URL za pomocą metody get().
Użyj ' Interfejs API adresu URL ” z „ otrzymać() ”, aby uzyskać wartości ciągu zapytania w JavaScript. Adres URL (Uniform Resource Locator) to sposób na znalezienie określonego zasobu internetowego. Zwykle składa się z protokołu (takiego jak „ http ' lub ' https “), nazwa domeny (jak “ przyklad.com “) i ścieżka (taka jak “ /ścieżka/do/zasobu “). Adresy URL służą do uzyskiwania dostępu do stron internetowych, pobierania plików i uzyskiwania dostępu do innych zasobów, w tym wartości ciągów zapytań w Internecie.
Przykład
Utwórz zmienną przechowującą adres URL z ciągami zapytań:
był urlQueryString = 'https://www.example.com/page.html?keyword=SearchText &fullname=jennyConvey &click=Submit' ;
Wywołaj obiekt URL, przekazując „ urlQueryString ”:
był ciąg zapytania = Nowy Adres URL ( urlQueryString ) ;
Użyj metody get() przekazując klucz „ słowo kluczowe ” zapytania, aby uzyskać jego wartość za pomocą atrybutu searchParams. Właściwość searchParams obiektu URL w języku JavaScript reprezentuje ciąg zapytania adresu URL. Zapewnia sposób manipulowania ciągiem zapytania adresu URL jako obiektem, a nie ciągiem:
był wartość1 = ciąg zapytania. searchParams . otrzymać ( „słowo kluczowe” ) ;konsola. dziennik ( 'wartość słowa kluczowego: ' + wartość1 ) ;
Uzyskaj drugą wartość z ciągu zapytania, przekazując jej klucz do metody get() i wypisuje na konsoli:
był wartość2 = ciąg zapytania. searchParams . otrzymać ( 'pełne imię i nazwisko' ) ;
konsola. dziennik ( 'wartość imienia i nazwiska: ' + wartość2 ) ;
Podobnie pobierz trzecią wartość w łańcuchu:
był wartość3 = ciąg zapytania. searchParams . otrzymać ( 'Kliknij' ) ;konsola. dziennik ( 'wartość kliknięcia: ' + wartość3 ) ;
Można zauważyć, że wartości ciągu zapytania zostały pomyślnie pobrane:
Metoda 2: Uzyskanie wartości ciągu zapytania przy użyciu parametru URLSearchParams za pomocą metody get().
„ URLSearchParams ” może być używany w JavaScript do pobierania wartości z ciągu zapytania. Ocenia ciąg zapytania adresu URL i oferuje medium umożliwiające dostęp do wartości. Pamiętaj, że powinieneś wysyłać tylko część ciągu zapytania z adresu URL, którą możesz pobrać za pomocą „ okno.lokalizacja.wyszukiwanie ” jako parametr funkcji URLSearchParams().
Przykład
Utwórz zmienną przechowującą ciąg zapytania:
Przekaż ciąg do „ URLSearchParams ' interfejs:
był ciąg zapytania = Nowy URLSearchParams ( urlQueryString ) ;Uzyskaj wartość klucza „ imię i nazwisko ” z ciągu zapytania za pomocą „ otrzymać() ' metoda:
był wartość1 = ciąg zapytania. otrzymać ( 'pełne imię i nazwisko' ) ;konsola. dziennik ( 'wartość imienia i nazwiska: ' + wartość1 ) ;
Wyjście
Uwaga : Posługiwać się ' const queryString = new URLSearchParams(window.location.search) ”, aby uzyskać aktualny/bieżący adres URL.
Po uzyskaniu bieżącego adresu URL pobierz z niego ciąg zapytania, utwórz instancję URLSearchParams i przekaż do niego ciąg zapytania. Na koniec uzyskaj wartość określonego parametru w ciągu zapytania za pomocą metody get().
Metoda 2: Uzyskanie wartości ciągu zapytania za pomocą narzędzia URLSearchParams za pomocą metody values().
Możesz także skorzystać z opcji „ wartości() ” z interfejsem URLSearchParams w celu pobrania wartości ciągu zapytania. Pomaga uzyskać dostęp do wszystkich wartości łańcucha jednocześnie.
Przykład
Przekaż ciąg zapytania do interfejsu URLSearchParams i zapisz go w zmiennej „ ciąg zapytania ”:
Wywołaj metodę values() w „ dla ”, aby uzyskać wszystkie wartości ciągu zapytania:
dla ( konst wartość queryString . wartości ( ) ) {konsola. dziennik ( wartość ) ;
}
Można zauważyć, że wszystkie wartości łańcuchów zostały pobrane:
To wszystko o pobieraniu wartości ciągu zapytania w JavaScript.
Wniosek
Aby uzyskać wartości ciągu zapytania, użyj „ Interfejs API adresu URL ” z „ otrzymać() ” metoda i „ searchParam ' atrybut. Właściwość searchParams obiektu URL w języku JavaScript reprezentuje ciąg zapytania adresu URL. Możesz także skorzystać z opcji „ URLSearchParams ” interfejs z „ otrzymać() ” metoda lub „ wartości() ' metoda. W tym blogu opisano procedurę uzyskiwania wartości ciągu zapytania w języku JavaScript.