Il metodo load() di jQuery è un metodo AJAX che permette di caricare del contenuto HTML esterno in un elemento della pagina corrente. Vediamone insieme i dettagli.
Supponiamo di avere un file HTML esterno così strutturato:
<h2>Test</h2>
<p id="test">...</p>
Possiamo caricare l'intera struttura in un elemento in questo modo:
$( "#wrapper" ).load( "test.html" );
Ora il nostro elemento apparirà così:
<div id="wrapper">
<h2>Test</h2>
<p id="test">...</p>
</div>
Con questo metodo possiamo anche specificare l'elemento HTML esterno da caricare aggiungendo un selettore dopo il nome del file HTML:
$( "#wrapper" ).load( "test.html #test" );
Ora il nostro elemento apparirà così:
<div id="wrapper">
<p id="test">...</p>
</div>
Se usate degli stili CSS nella pagina esterna, non sempre questi verranno caricati nella pagina di destinazione. Infatti non tutti i browser sono in grado di clonare gli stili presenti nel file esterno. Per questo motivo se ne sconsiglia l'uso.