Le QueryString con Javascript

Corso jQuery
Creare applicazioni client-side col Framework jQuery

Scritto da Luca Ruggiero nella sezione Javascript

Le QueryString sono un sistema per passare parametri all'indirizzo di una pagina Web, accodando alla fine del file corrente una serie di informazioni, secondo le quali, è possibile ottenere, nell'ambito della stessa pagina, risultati diversi.

Una QueryString semplice è composta da una variabile ed il rispettivo valore, ad esempio

?id=1
è una QueryString, in cui id è la variabile e 1 è il suo valore corrente.

Le QueryString sono composte anche da una serie di caratteri speciali:
? divide l'estensione del file dalla prima variabile della QueryString
& divide la prima variabile della QueryString da un'eventuale seconda in poi
= attribuisce alla variabile il suo valore
Javascript, essendo un linguaggio lato client, non supporta nativamente questo metodo, ma dispone della proprietà location.search, con la quale è possibile catturare la QueryString passata alla pagina.

Se ad esempio scrivo
document.write(location.search);
ottengo in output

avendo, effettivamente, questa pagina dei parametri passati in QueryString.

E' possibile sfruttare questa proprietà per gestire questo tipo di metodo anche lato client, vediamo come.
Iniziamo col creare un file, ad esempio index.html in cui impostiamo i seguenti link, che punteranno al file querystring.html, con diverse QueryString:
<a href="querystring.html?id=1">Pagina # 1</a>
<a href="querystring.html?id=2">Pagina # 2</a>
<a href="querystring.html?id=3">Pagina # 3</a>
Vediamo cosa scrivere nel file querystring.html:
<html>
 <head>
  <title>Esempio di utilizzo delle QueryString con Javascript</title>
  <script language="javascript">
   <!--
    // Inizializzo la QueryString
    var querystring = location.search;
   //-->
  </script>
 </head>
<body>

<script language="javascript">
 <!--
  if (querystring == "?id=1") {
      // Definisco l'azione nel caso in cui il valore della QueryString sia 1
      document.write("Stai visitando la pagina numero uno!");
  }
  else if (querystring == "?id=2") {
      document.write("Stai visitando la pagina numero due!");
  }
  else if (querystring == "?id=3") {
      document.write("Stai visitando la pagina numero tre!");
  }
  else {
      document.write("ERRORE 404 - File non trovato!");
  }
 //-->
</script>

</body>
</html>
E così via per tutte le pagine che vogliamo!

I più cliccati della sezione Javascript

:: jQuery Validation: validazione di un form con jQuery (107.912)

:: Breve guida a jQuery (98.602)

:: Le espressioni regolari in Javascript (84.989)

:: Gestione delle stringhe in Javascript (74.986)

:: Stampare una pagina col Dhtml (42.850)

:: Inserire in automatico lo slash nel formato data gg/mm/aaaa (41.642)

:: Menu orizzontale dinamico in Dhtml (37.187)

:: Gli Array in Javascript (35.935)

:: Temporizzazioni Javascript (31.623)

:: Istruzion condizionali in Javascript: if e switch (28.943)

IN EVIDENZA
DOWNLOAD