Introduzione a jQuery

La libreria jQuery può essere aggiunta al sito web con un singolo tag.

Caratteristiche della libreria jQuery

jQuery è una libreria di funzioni JavaScript.

La libreria jQuery include le seguenti caratteristiche:

  • Selezione degli elementi HTML
  • Operazioni sugli elementi HTML
  • Operazioni CSS
  • Funzioni di eventi HTML
  • Effetti e animazioni JavaScript
  • Esplorazione e modifica dell'HTML DOM
  • AJAX
  • Utilità

Aggiungi la libreria jQuery alla tua pagina

La libreria jQuery si trova in un file JavaScript che contiene tutte le funzioni di jQuery.

È possibile aggiungere jQuery alla pagina utilizzando i seguenti tag:

<head>
<script type="text/javascript" src="jquery.js"></script>
</head>

Notare che il tag <script> dovrebbe essere posizionato nella sezione <head> della pagina.

Esempio jQuery di base

Esempio seguente dimostra la funzione hide() di jQuery, che nasconde tutti gli elementi <p> del documento HTML.

Esempio

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("document").ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2Questo è un titolo</h2>
<pQuesto è un paragrafo.</p>
<p>Questo è un altro paragrafo.</p>
<button type="button">Clicca qui</button>
</body>
</html>

Provarlo personalmente

Scaricare jQuery

Sono disponibili due versioni di jQuery per il download: una è ottimizzata, l'altra non compressa (per debug o lettura).

Entrambe le versioni sono disponibili jQuery.com Scaricare

Sostituzione della libreria

Google e Microsoft offrono un ottimo supporto a jQuery.

Se non desiderate conservare la libreria jQuery sul vostro computer, potete caricare i file di core jQuery da Google o Microsoft CDN.

Utilizzare il CDN di Google

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
</head>

Utilizzare il CDN di Microsoft

<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery
/jquery-1.4.min.js"></script>
</head>