de la fenêtre.onload semble déclencher avant que le DOM est chargé (JavaScript)
Je vais avoir des ennuis avec la fenêtre.onload et document.onload événements. Tout ce que je lis me dit, cela ne posera pas de déclenchement jusqu'à ce que le DOM est chargé avec toutes ses ressources, il semble que ce n'est pas le cas pour moi:
J'ai essayé les simple page dans google Chrome 4.1.249.1036 (41514) et internet explorer 8.0.7600.16385 avec le même résultat: à la fois affiché le message "échec!", indiquant que myParagraph n'est pas chargé (et donc les DOM semble incomplète).
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<script type="text/javascript">
window.onload = doThis();
//document.onload gives the same result
function doThis() {
if (document.getElementById("myParagraph")) {
alert("It worked!");
} else {
alert("It failed!");
}
}
</script>
</head>
<body>
<p id="myParagraph">Nothing is here.</p>
</body>
</html>
J'utilise plusieurs scripts complexes que cela, dans une externe .fichier js, mais cela illustre bien le problème. Je peux le faire en ayant la fenêtre.onload régler la minuterie pour une demi-seconde pour exécuter suivre(), mais cela semble être une solution peu élégante, et ne répond pas à la question de savoir pourquoi la fenêtre.onload ne semblent pas faire ce que tout le monde dit qu'il fait. Une autre solution serait de mettre une minuterie qui va vérifier si le DOM est chargé, et si non, il va juste s'appeler lui-même une demi-seconde plus tard (donc il va garder le contrôle jusqu'à ce que le DOM est chargé), mais cela semble trop complexe pour moi.
Est-il plus approprié de l'événement à utiliser?
doThis()
est un énoncé qui renvoie undefined après évaluation, parce que doThis
n'a pas de return
de l'opérateur. window.onload = doThis;
va faire le travail. Remarque il n'y a pas parenthesW3Schools est une mauvaise source d'information. Ils ne sont pas affiliés avec le W3C en aucune façon. Ne pas traiter w3schools comme une source fiable d'informations, de les traiter de la façon dont ils méritent d'être traités: les nuisances les liens que vous avez à sauter lorsque vous effectuez une recherche pour un véritable site de référence.
l'actuel me convient complètement. Je recommande w3fools.com pour quelqu'un qui n'est pas sûr. J'ai tendance à aller tout droit pour developer.mozilla.org pour la haute qualité de l'info ces jours, puis faire de plus en plus vastes de recherche si je ne trouve pas ce que je suis à la recherche (qui est généralement quand je suis en train de faire quelque chose de ridicule). Je suis assez gêné que par le passé-moi au courant... mais je peux le supprimer! Il y en a un moins naïve référence à w3schools sur Internet 🙂 Merci pour le spotting.
OriginalL'auteur David Mason | 2010-03-20
Vous devez vous connecter pour publier un commentaire.
À la fenêtre de temps est chargé, le corps n'est pas encore chargé, par conséquent, vous devriez corriger votre code de la manière suivante:
Testé pour fonctionner dans FF/IE/Chrome, bien que la réflexion sur la gestion des
document.onload
trop.Comme déjà mentionné, à l'aide de js-cadres sera une bien meilleure idée.
a fonctionné pour moi aussi, merci s'accoupler!
Notez que l'utilisation de cette approche pour les 2 scripts sera probablement remplacer l'un avec l'autre. Ces jours-ci j'ai tendance à utiliser document.la méthode addEventListener("DOMContentLoaded", function(event) { console.log("DOM entièrement chargé et analysées"); }); Voir: developer.mozilla.org/en-US/docs/Web/Reference/Events/...
DomContentLoaded était chargement avant onload dans mes tests. Parfois, le speechSynthesis.getVoices() est un tableau vide sur la charge de l'événement et sur l'événement DOMContentLoaded. Est-il un cas plus tard?
Je ne sais rien à propos de la façon dont votre
speechSynthesis.getVoices()
est censé être chargé alors à la recherche de contenu de la charge peut ne pas être la chose à faire, si il y a un script de chargement, alors vous besoin de votre script qui tente de l'utiliser à apparaître après que le script (et pas que le script marqué asynchrones).OriginalL'auteur Li0liQ
Suffit d'utiliser
window.onload = doThis;
au lieu dewindow.onload = doThis();
OriginalL'auteur dgk
Il est important de comprendre que
()
est un opérateur, tout comme+
ou&&
.()
Prend une fonction et l'appelle.Donc, dans ce cas,
doThis
est un objet de fonction, et()
est l'opérateur qui appelle la fonction.doThis()
combinée à l'ensemble des appelsdoThis
, exécute et évalue à la valeur de retour dedoThis
Donc
window.onload = doThis()
est essentiellement de l'affectation de la valeur de retour dedoThis
àwindow.onload
Et donc, pour remédier à cela, vous avez besoin de faire référence à la fonction elle-même, de ne pas l'appeler.
Ne
window.onload = doThis
OriginalL'auteur OverCoder
Avez-vous essayé d'utiliser une bibliothèque javascript au lieu de cela, par exemple, jQuery et c'est
$(document).ready()
fonction:C'est certainement exagéré pour ajouter une bibliothèque juste pour ce - la bibliothèque de téléchargement ajoute de la latence et le transfert de données et, probablement, seulement vous permet d'économiser quelques caractères. jQuery est particulièrement lourd. Cela dit, si vous utilisez déjà une bibliothèque pour d'autres choses, il ya probablement peu ou pas de mal à l'utiliser pour gérer l'attachement d'une fonction pour les dom-prêt événement.
Maçon je suis totalement d'accord. La plupart des cas, j'ai trouvé jquery DOUBLES temps de chargement de page..
si vous chargez jquery (ou tout autre populaire de la bibliothèque javascript) à partir d'un CDN, alors les chances sont grandes que votre navigateur possède déjà les fichiers js dans son cache (à partir de visites sur d'autres sites web), donc les temps de chargement ne devrait pas augmenter sensiblement.
OriginalL'auteur M4N
Il dépend de l'endroit où vous mettez le onload function (la tête ou le corps de la balise ou plus bas), d'événements internes de liaison seeemingly légèrement différente dans les différents navigateurs.
Voir aussi
de la fenêtre.onload vs document.onload
OriginalL'auteur Lorenz Lo Sauer