web-dev-qa-db-fra.com

Jquery .ready () vs window.onload

Y a-t-il des avantages à utiliser la fonction Jquery ready () par rapport à window.onload?

// Jquery ready
$(document).ready(function() {

});

// window.onload
window.onload = function () {

}
javascriptjqueryonload
22
James

Cela dépend de ce que vous voulez faire.

  • jQuery ready exécutera votre code lorsque le code HTML sera prêt, mais avant la fin des images et des autres ressources. C'est le plus tôt possible que vous pouvez changer le DOM avec JavaScript, il est donc largement utilisé. (Dans les navigateurs modernes, il est remplacé par l'événement natif DOMContentLoaded ).
  • window.onload (l'événement load ) s'exécute après que tout a terminé le chargement. Images, Flash et certains scripts, mais généralement pas des feuilles de style. Utilisez ceci pour du code qui ne devrait s'exécuter que lorsque la page ne changera plus.

De plus, avec window.onload vous ne pouvez attacher qu'un seul écouteur, mais vous pouvez en attacher autant que vous le souhaitez avec jQuery ready. Pour attacher plusieurs événements sur window.onload, utilisez addEventListener:

window.addEventListener('load', function () {

}, false);
38
rvighne

Oui, window.onload vous permet d'avoir un seul écouteur. jQuery ready attache autant d'auditeurs que vous le souhaitez.

2
Elie

Windows.onload attendra que tout se charge sur une page, y compris les images. Document.ready se déclenchera dès que le html sera chargé.

2
Papa