Exécuter la fonction JavaScript lorsque le DOM est “prêt”?
Je suis en utilisant un JavaScript script d'upload qui dit que pour exécuter la fonction initialize dès que le DOM est prêt. J'ai actuellement il fonctionne très bien avec soit un appel à la fonction avec body.onload
ou directement après la fonction est définie. La fonction s'appuie le code HTML dans un espace réservé div qui agit en tant que fichier outil de transfert.
Ma question est quelle est la meilleure pratique ici? Depuis il fonctionne pour l'instant, pourquoi disent les instructions pour exécuter la fonction init dès que le DOM est prêt? Dois-je ajouter un <script> tag directement après l'espace réservé DIV par exemple?
Vous devez vous connecter pour publier un commentaire.
La solution la plus simple est l'utilisation de jQuery et de ses
$(document).ready(function() { .... });
fonction. Au lieu de....
vous mettez votre propre code.Noter qu'il se fait de la même chose @Shadow2531 suggéré, mais aussi des œuvres dans les vieux navigateurs ne supportant événement.
Vous faites cela de sorte que vous savez tous les analysé les éléments sont disponibles dans les DOM etc.
Le DOM est généralement prêt avant onLoad s'exécute. onLoad ne fonctionne après tout, charges externes, les scripts, les images, feuilles de style, etc.
Mais le DOM, c'est à dire la structure HTML est prêt avant que. Si vous exécutez le code en bas de la page (ou d'après les parties de la page, le script fonctionne avec) qui fonctionne très bien.
En 2015, vous avez deux options avec les navigateurs modernes:
document.onload
fenêtre.onload
À la fois des événements ci-dessus serait mieux utilisé avec fenêtre.la méthode addEventListener() bien sûr, comme plusieurs auditeurs seraient permis.
Comme vous le savez probablement, vous ne devriez pas exécuter les fonctions d'initialisation avant que le DOM est chargé complètement.
La raison pour laquelle vous devez exécuter la fonction init dès que le DOM est prêt, c'est qu'une fois la page chargée, l'utilisateur commence à frapper les boutons etc. Vous avez pour minimiser le petit inavoidable écart lorsque la page est chargée et l'initialisation des fonctions n'ayant pas encore de. Si cet écart est trop grand (c'est à dire. trop longtemps) votre utilisateur peut faire l'expérience de inappropiate comportement... (ie. votre téléchargement ne fonctionnera pas).
D'autres utilisateurs ont fourni de bons exemples de la façon d'appeler la fonction init, donc je ne vais pas répéter ici... 😉
Obtenir jQuery et utiliser le code suivant.
Vous pourriez tout aussi bien déplacer le vers le bas de votre page comme ceci: