Ako získať hodnoty reťazca dopytu v JavaScripte

Hodnoty reťazca dopytu v adrese URL často poskytujú informácie o požiadavke, ako sú parametre vyhľadávania. Reťazec dopytu možno použiť na vyžiadanie webovej stránky pomocou protokolu HTTP. Príležitostne môže byť potrebné načítať atribúty reťazca dotazu vo vašom skripte. Okrem toho vedieť, ako extrahovať údaje reťazca dopytu z adresy URL, je nevyhnutné, ak sa v klientskom rozhraní spracováva akákoľvek obchodná logika alebo logika požiadaviek.

Tento blog bude definovať postup na získanie hodnôt reťazca dotazu v JavaScripte.

Ako získať hodnoty reťazca dopytu v JavaScripte?

Ak chcete získať hodnoty reťazca dotazu v jazyku JavaScript, použite nasledujúce metódy:

Použite URL API s metódou get().
URLSearchParams s metódou get().
URLSearchParams s metódou values().

Metóda 1: Získanie hodnôt reťazca dotazu pomocou rozhrania URL API s metódou get().

Použi ' URL API “ s „ dostať () ” na získanie hodnôt reťazca dotazu v jazyku JavaScript. URL (Uniform Resource Locator) je spôsob, ako nájsť konkrétny internetový zdroj. Zvyčajne sa skladá z protokolu (ako napr. http “ alebo „ https “), názov domény (napríklad „ example.com “) a cestu (ako napr. /cesta/k/zdroju “). Adresy URL sa používajú na prístup k webovým stránkam, sťahovanie súborov a prístup k iným zdrojom vrátane hodnôt reťazcov dopytov na internete.

Príklad
Vytvorte premennú, ktorá uloží adresu URL s reťazcami dopytu:

bol urlQueryString = 'https://www.example.com/page.html?keyword=SearchText &fullname=jennyConvey &click=Submit' ;

Zavolajte objekt adresy URL zadaním „ urlQueryString “:

bol queryString = Nový URL ( urlQueryString ) ;

Použite metódu get() odovzdaním kľúča „ kľúčové slovo ” dotazu, aby ste získali jeho hodnotu s atribútom searchParams. Vlastnosť searchParams objektu URL v jazyku JavaScript predstavuje reťazec dopytu adresy URL. Poskytuje spôsob, ako manipulovať s reťazcom dopytu adresy URL ako s objektom, a nie s reťazcom:

bol hodnota1 = queryString. searchParams . dostať ( 'kľúčové slovo' ) ;
konzoly. log ( 'hodnota kľúčového slova: ' + hodnota1 ) ;

Získajte druhú hodnotu z reťazca dotazu odovzdaním jej kľúča metóde get() a vytlačí sa na konzole:

bol hodnota2 = queryString. searchParams . dostať ( 'celé meno' ) ;
konzoly. log ( 'hodnota celého mena: ' + hodnota2 ) ;

Podobne získajte tretiu hodnotu v reťazci:

bol hodnota3 = queryString. searchParams . dostať ( 'kliknúť' ) ;
konzoly. log ( 'hodnota kliknutia: ' + hodnota3 ) ;

Je vidieť, že hodnoty reťazca dotazu boli úspešne načítané:

Metóda 2: Získanie hodnôt reťazca dotazu pomocou URLSearchParams s metódou get().

' URLSearchParams ” rozhranie možno použiť v JavaScripte na získanie hodnôt z reťazca dotazu. Vyhodnocuje reťazec dopytu adresy URL a ponúka médium na prístup k hodnotám. Všimnite si, že by ste mali odoslať len časť reťazca dopytu adresy URL, ktorú môžete získať pomocou „ vyhľadávanie.okna ” ako parameter pre URLSearchParams().

Príklad
Vytvorte premennú, ktorá ukladá reťazec dotazu:

bol urlQueryString = 'keyword=SearchText &fullname=jennyConvey &click=Submit' ;

Zadajte reťazec do „ URLSearchParams ' rozhranie:

bol queryString = Nový URLSearchParams ( urlQueryString ) ;

Získajte hodnotu kľúča “ celé meno “ z reťazca dopytu pomocou „ dostať () “ metóda:

bol hodnota1 = queryString. dostať ( 'celé meno' ) ;
konzoly. log ( 'hodnota celého mena: ' + hodnota1 ) ;

Výkon

Poznámka : Použite „ const queryString = new URLSearchParams(window.location.search) ” na získanie aktuálnej/aktuálnej adresy URL.

Po získaní aktuálnej adresy URL z nej získajte reťazec dopytu, vytvorte inštanciu URLSearchParams a odovzdajte mu reťazec dopytu. Nakoniec získajte hodnotu konkrétneho parametra v reťazci dotazu pomocou metódy get().

Metóda 2: Získanie hodnôt reťazca dotazu pomocou URLSearchParams s metódou values().

Môžete tiež použiť „ hodnoty() ” pomocou rozhrania URLSearchParams na získanie hodnôt reťazca dotazu. Pomáha pristupovať ku všetkým hodnotám reťazca naraz.

Príklad
Zadajte reťazec dopytu do rozhrania URLSearchParams a uložte ho do premennej “ queryString “:

bol queryString = Nový URLSearchParams ( urlQueryString ) ;

Zavolajte metódu values() v „ pre “, aby ste získali všetky hodnoty reťazca dotazu:

pre ( konšt hodnota queryString . hodnoty ( ) ) {
konzoly. log ( hodnotu ) ;
}

Je možné pozorovať, že boli načítané všetky hodnoty reťazca:

To je všetko o získaní hodnôt reťazca dopytu v jazyku JavaScript.

Záver

Na získanie hodnôt reťazca dotazu použite „ URL API “ s „ dostať () “ metóda a “ searchParam “. Vlastnosť searchParams objektu URL v jazyku JavaScript predstavuje reťazec dopytu adresy URL. Môžete tiež použiť „ URLSearchParams rozhranie s rozhraním „ dostať () “ metóda alebo “ hodnoty() “. Tento blog opísal postup na získanie hodnôt reťazca dotazu v jazyku JavaScript.

Ako získať hodnoty reťazca dopytu v JavaScripte