Quando si definiscono le funzioni javascript all'interno di $ (documento).pronto() e quando non lo fai?
Se le funzioni dovrebbero essere accessibile a livello globale (che potrebbe indicare una cattiva progettazione della vostra applicazione), allora è necessario definire loro al di fuori del gestore ready.
È abbastanza sicuro solo inserire tutto il codice javascript all'interno di $ (document) .ready()?
Vedere sopra.
Cosa succede quando non lo fai?
Dipende da cosa sta facendo il codice JavaScript e da dove si trova. Nel peggiore dei casi si avranno errori di runtime perché si sta tentando di accedere agli elementi DOM prima che esistano. Ciò avverrebbe se il codice si trova nello head e non si definiscono solo le funzioni, ma si sta già tentando di accedere agli elementi DOM.
Ad esempio, utilizzo i soliti selettori jQuery che fanno qualcosa quando si fa clic su qualcosa. Se non li avvolgi con il documento, già qual è il danno?
Non c'è "danno" di per sé. Non funzionerebbe se lo script si trova nello head, perché gli elementi DOM non esistono ancora. Ciò significa che jQuery non può trovare e associare il gestore a loro.
Ma se si posiziona lo script poco prima del tag di chiusura body, allora gli elementi DOM esisteranno.
Per essere sul sicuro, ogni volta che si desidera accedere a elementi DOM, inserire queste chiamate nel gestore ready evento o in funzioni che sono chiamati solo dopo che il DOM è stato caricato.
Come il jQuery tutorial (si dovrebbe leggerlo) già afferma:
Come quasi tutto ciò che facciamo quando si utilizza jQuery legge o manipola il Document Object Model (DOM), abbiamo bisogno di fare in modo che si cominci l'aggiunta eventi ecc. non appena il DOM è pronto.
Per fare ciò, registriamo un evento pronto per il documento.
$(document).ready(function() {
// do stuff when DOM is ready
});
Per dare un esempio più completo:
<html>
<head>
<!-- Assuming jQuery is loaded -->
<script>
function foo() {
// OK - because it is inside a function which is called
// at some time after the DOM was loaded
alert($('#answer').html());
}
$(function() {
// OK - because this is executed once the DOM is loaded
$('button').click(foo);
});
// OK - no DOM access/manipulation
alert('Just a random alert ' + Math.random());
// NOT OK - the element with ID `foo` does not exist yet
$('#answer').html('42');
</script>
</head>
<body>
<div id="question">The answer to life, the universe and everything</div>
<div id="answer"></div>
<button>Show the answer</button>
<script>
// OK - the element with ID `foo` does exist
$('#answer').html('42');
</script>
</body>
</html>
Grazie. Mi chiedo se questo è il motivo per cui ho avuto un comportamento strano. – Dave31415