Come ottenere il valore del parametro URL in JavaScript

Come ottenere il valore del parametro URL in JavaScript
Ci può essere una situazione nei programmi JavaScript in cui è necessario accedere ad alcuni dati o una parte di un URL per utilizzarli in base alle proprie esigenze. Ad esempio, è necessario individuare i dati che si riferiscono all'attributo corrispondente. In tali casi, la tecnica per ottenere i valori dei parametri URL in JavaScript risparmia molto tempo e sforzi.

Questo articolo discuterà i metodi per ottenere il valore del parametro URL in JavaScript.

Come ottenere il valore del parametro URL in JavaScript?

Per ottenere il valore del parametro URL in JavaScript, è possibile utilizzare i seguenti approcci:

  • "diviso()Metodo "con"per" ciclo continuo
  • UrlsearchParams"Oggetto

Passare attraverso i metodi discussi uno per uno!

Metodo 1: ottieni il valore del parametro URL in JavaScript usando il metodo "Split ()" con loop "per"

IL "diviso()"Il metodo divide una determinata stringa in una matrice di sottostringi senza alcuna modifica nella stringa originale. Questo metodo può essere applicato a un determinato URL in due parti e un ciclo for può essere utilizzato per controllare l'iterazione con l'aiuto della proprietà di lunghezza per ottenere tutti i valori dei parametri.

Sintassi

corda.diviso (separatore, limite)

Qui, "separatore"Si riferisce alla stringa che deve essere divisa e"limite"È un numero che rappresenta i limiti di divisione.

Dai un'occhiata al seguente esempio per comprendere il concetto dichiarato.

Esempio

Nell'esempio seguente, creeremo un pulsante e collegheremo un evento OnClick che accederà al "getParameters ()" funzione:

Ora definiremo la funzione getparameters (). Nella sua definizione, viene aggiunto un URL di un dominio di esempio a cui verrà accessibile e memorizzato in una variabile denominata "geturl". Successivamente, l'URL specificato verrà diviso in due parti usando "?"Come separatore e"1"Come limite e"E"Separerà quindi ogni stringa di parametro e la memorizzerà in"parametri" vettore.

Dopo di che, "per"Il ciclo verrà applicato in modo tale che ciascuno dei parametri e il suo valore verranno visualizzati sulla console:

funzione getParameters ()
let getURL = "https: // esempio.com/?Product = Shirts & Color = White & User = Anonymous & size = S ";
Let getParameters = getURL.diviso('?') [1];
LetParams = getParameters.diviso('&');
per (let i = 0; i letValue = params [i].split ('==');
console.log (valore [0], valore [1]);

L'output dell'implementazione di cui sopra risulterà come segue:

Si trattava di accedere a tutti i valori dei parametri contemporaneamente. Tuttavia, se si desidera ottenere un valore di un parametro specifico, spostati alla sezione successiva!

Metodo 2: Ottieni il valore del parametro URL in JavaScript con l'oggetto UrlSearchParams

IL "UrlsearchParams"Può anche essere utilizzato per ottenere l'URL specificato usando un oggetto e prendere un valore particolare rispetto all'attributo corrispondente.

Passare attraverso l'esempio seguente per ulteriori dimostrazioni.

Esempio

Innanzitutto, includi un pulsante con un "al clic"Evento che accederà alla funzione specificata come discusso nel metodo precedente:

Successivamente, verrà definita una funzione denominata urlparameter (). Qui un nuovo oggetto chiamato "UrlsearchParams"Viene creato, che accederà all'URL specificato riferendosi al dominio di esempio. Infine, visualizza tutti i valori corrispondenti all'attributo specificato. Nel nostro caso,

funzione urlparameter ()
Let getURL = new UrlSearchParams ("https: // esempio.com/?Product = Shirts & Color = White & User = Anonymous & size = S ")
console.registro (geturl.get ('utente'));

Produzione

Nell'output sopra, si può osservare che il "anonimo"Il valore è recuperato per il"utente"Parametro.

Abbiamo illustrato diversi metodi per ottenere i valori dei parametri URL in JavaScript.

Conclusione

Per ottenere il valore del parametro URL in JavaScript, utilizzare il “diviso()Metodo "con il"per"Loop per dividere l'URL specificato, separare ciascun valore del parametro e visualizzarli aggiungendo la condizione richiesta rispetto ai loro attributi corrispondenti. Anche il "UrlsearchParams"Il metodo dell'oggetto può essere utilizzato per creare un nuovo oggetto ed estrarre il valore di un attributo specifico. Questo articolo ha dimostrato i metodi per ottenere i valori dei parametri URL in JavaScript.