2012-05-24 12 views
5

I sa questo sembrerà una domanda stupida, ma mentre sto imparando jQuery dall'esempio, sto trovando che il posizionamento degli script e delle funzioni varia molto da esempio ad esempio . Caso in questione, da qualche parte ho letto che la funzione .onReady dovrebbe essere posta al di sotto di tutto il resto per assicurare che l'intero DOM sia effettivamente pronto, e cose di questa natura.jQuery suggerimento posizionamento codice

La domanda è semplicemente questa, a parte i tag di script ovvie, c'è una best practice su dove deve essere posizionato il file jquery in PHP? Che dire degli script inline unici? Ci scusiamo per la natura ingenua di questo, ma dovrei provare questi esempi in un modo "giusto", come ho capito come portare tutto insieme.

Questo sito sembra avere alcune persone molto perspicaci che contribuiscono, quindi grazie in anticipo per qualsiasi consiglio! :)

A parte questo non era così stupido come pensavo - grazie a tutti per le intuizioni - sento un po 'più di chiarezza su ciò che stavo cercando di capire nel quadro generale.

+2

Questa è una domanda particolarmente interessante perché framework come ASP.Net MVC che creano la pagina come una serie di componenti (viste aka) tendono a mantenere i frammenti HTML e gli script che agiscono su quei frammenti nella stessa vista, causando la risultante JavaScript per essere sparsi sulla pagina finale. Mi sono chiesto prima se ci sono problemi con questo approccio. –

+0

Sono con te ... ho lavorato con dozzine di linguaggi/framework diversi nella mia carriera, e senza conoscere l'aspetto nuda del funzionamento di ognuno di questi, ho anche riflettuto su questo mentre sto tornando a casa di notte, lol. – GDP

+0

+1 per linguaggio soft – Rab

risposta

8

Per quanto ne sappia, non v'è alcuna .onReady

Forse ti riferisci $(document).ready()?

Il punto dello .ready() è attendere che l'elemento sia pronto. In questo caso, il documento. Quindi nulla all'interno di questo verrà eseguito fino a quando il documento non sarà pronto. Come tale, puoi metterlo ovunque tu voglia.

Quanto a cui ci si collega a file JS, tuttavia, si vuole fare che in fondo al documento per motivi di prestazioni:

http://developer.yahoo.com/performance/rules.html

+1

Forse sta affermando l'ovvio, ma nel caso, è necessario mettere il tuo '$ (document) .ready() 's dopo aver caricato jQuery, quindi' anywhere' non è strettamente vero. – jeroen

+0

DA, accetterà la tua risposta perché risponde alla mia più ampia preoccupazione, piuttosto che affrontare semplicemente l'aspetto .ready. Grazie mille per l'intuizione e il collegamento. –

+1

Solo un punto di chiarezza, '.ready()' può essere chiamato solo su 'document', non funzionerà per elementi ordinari e verrà attivato una sola volta. –

2

È necessario includere il <script type="text/javascript"></script> prima della chiusura del tag <body> della pagina. Ciò garantirà che tutta la parte statica della pagina sopra verrà caricata prima di essa.

+0

Vedere il mio commento sotto la domanda su come alcuni framework compongono pagine da componenti. Perché dici "dovrebbe". Cosa può/può rompersi se non lo fai? –

+0

Dovresti posizionarlo lì per motivi di prestazioni - ma con jQuery non è necessario inserirlo per non dover attendere il caricamento delle parti statiche del dom. (In altre parole, sì, mettilo prima del tag di chiusura BODY, ma per altri motivi) –

+0

E inoltre, ci sono scelte per mettere il codice associato ad alcuni eventi attivati ​​dal browser come .load, .ready ecc. – Vishal

4

Non so su PHP, ma le istruzioni per inserisci tutti i codici onReady in fondo "per assicurare che l'intero DOM sia effettivamente pronto"è sbagliato!

L'intero punto dell'evento pronto è che puoi posizionarlo ovunque desideri e funzionerà ancora.

Esempio:

$('#foo').val() // undefined - the DOM isn't ready yet. 

$(document).ready(function(){ 
    $('#foo').val() // bla - the DOM is ready now. 
}); 
<input id="foo" value="bla" /> 

Live DEMO

Nota che $(callbackFunction) uguale alla sintassi verbose $(document).ready(callbackFunction);

si dovrebbe leggere il ready docs

+0

Non direi che l'istruzione stessa sia sbagliata. Il ragionamento è sbagliato di sicuro. – kapa

+0

@ bažmegakapa. Punto preso. L'ho modificato un po '. – gdoron

0

L'istruzione pronto permetterà di mettere la vostra codice javascript everyw Qui. Sarà eseguito solo quando il documento è pronto.

La sintassi è la seguente:

$(document).ready(function() { 
    // Put your code here. 
}); 

O questo:

$(function() { 
// Put your code here. 
}); 

Ma per fare una scelta, preferiscono la parte inferiore della pagina, subito prima della chiusura </body>, per motivi di prestazioni.

Problemi correlati