Abbiamo parlato un bel po 'di selettori. Un selettore jQuery come $ ("h1") selezionerà tutto
Sarà quello $("h1").css("color", "red");
Ma a volte gli script vengono caricati nella testa. Ci sono tutti i tipi di scuse per questo, per lo più cattive, ma hey non giudichiamo troppo senza dettagli =).
Possiamo ancora risolvere il problema della mancata ricerca degli elementi in modo abbastanza soddisfacente anche se siamo costretti a caricare gli script nella testa. Lo facciamo attraverso la funzione jQuery "DOM Ready". Letteralmente, quando il documento è finito e pronto per essere manipolato. Assomiglia a questo:
$(document).ready(function() ( ));C'è una versione più breve che fa esattamente la stessa cosa:
$(function() ( ));Mettere il codice all'interno di una funzione del genere garantisce che non venga eseguito fino a quando il documento non è pronto. In realtà è un bit di codice piuttosto intelligente che lo fa, il che ovviamente è difficile da fare cross-browser. La cosa interessante è che è abbastanza veloce. Non è la stessa cosa che attendere il caricamento dell'intera finestra, il che è lento, perché attende che tutte le risorse vengano scaricate prima di avviarsi. La predisposizione per DOM avviene molto prima. Se hai bisogno di aspettare che le risorse siano finite (ad esempio devi misurare un'immagine), puoi aspettare così:
$(window).load(function() ( ));Risolvendo il nostro precedente problema JavaScript-in-the-head con DOM pronto, il codice sarebbe simile a questo:
Learning jQuery $(function() ( $("h1").css("color", "red"); ));