Équivalent en JS de la méthode .ready()

Version imprimable

25/09/2016, 16h34
Beginner.

Équivalent en JS de la méthode .ready()

Salut,

J'ai galéré sur un code qui ne fonctionnait pas car j'avais placé le script dans le header or du coup (si j'ai bien compris) on ne peut pas travailler sur les éléments de la page puisque qu'ils ne sont pas encore chargés alors comment faire si on ne veut pas placer le script à la fin du body ?

Je ne connais pas grand chose à jQuery mais je vois parfois la méthode .ready() d'où ma question : Qu'est-ce que vous utilisez en JS comme équivalent de la méthode .ready() ?

Déjà je crois qu'il y a l’éventement onload, à utiliser avec window je crois : window.onload=function() {...}, c'est ça ?

Merci.

Code:

1
2
3
4
5
6
7
document.addEventListener( 'DOMContentLoaded', function( ev ){
  //code
});
 
window.addEventListener( 'load', function( ev ){
  //code
});

26/09/2016, 19h24
Beginner.

Merci.

Si j'ai bien compris il y a au moins deux possibilités...
26/09/2016, 23h04
danielhagnoul

Il en a existé plusieurs à cause des incompatibilités des navigateurs obsolètes, mais celle que je vous donne est la seule qui soit recommandée par le W3C.
Voir : https://developer.mozilla.org/fr/doc...dEventListener
27/09/2016, 18h33
Beginner.

Merci. J'ai vu qu'ici : #4 tu as utilisé les deux dans le même script, y a-t-il une raison particulière ou c'est juste comme ça ?

Il s'agit de deux gestionnaires d'événement différent

Code:

1
2
3
4
5
6
7
8
9
// le DOM est chargé
document.addEventListener( 'DOMContentLoaded', function( ev ){
  // code manipulant le DOM avant l'affichage de la page web
});
 
// la page web est chargée 
window.addEventListener( 'load', function( ev ){
  // code manipulant le contenu de la page web
});

29/09/2016, 16h14
Beginner.

Ah c'est utile à savoir...
Merci et +1 et je mets "résolu" !