Tout d’abord, l’ordre de chargement des pages :
Analyser la structure HTML.
Chargez des scripts externes et des fichiers de feuilles de style.
Analyser et exécuter le code du script.
Construisez un modèle HTML DOM.
Chargez des fichiers externes tels que des images.
La page est chargée.
C'est-à-dire:
html → en-tête → titre → #texte (titre de la page Web) → style → charger le style → analyser le style → lien → charger le fichier de feuille de style externe → analyser la feuille de style externe → script → charger le fichier de script externe → analyser le fichier de script externe → exécuter le script externe → corps → div → script → charger le script → analyser le script → exécuter le script → img → script → charger le script → analyser le script → exécuter le script → charger le fichier image externe → initialisation de la page terminée.
Chargement initial de JS.
en chargement
Il n'est pas appelé lorsque le document est chargé, mais lorsque tous les éléments de la page (y compris les images, etc.) sont chargés. S'il y a des images de grande taille sur la page et que le téléchargement prend beaucoup de temps, alors le script le fera. ne pourra jamais être chargé. Initialisation, jusqu'à ce que le chargement de l'image soit terminé, l'expérience utilisateur sera grandement affectée dans les cas graves. Cependant, window.onload n'est pas inutile. Dans de nombreux cas, certains logiciels B/S nécessitent que la page soit. entièrement chargé avant de fournir des fonctions liées à l'utilisateur, donc fenêtre .onload Il peut fournir une fonction de "chargement", ou le contenu de la page est très petit, et document.ready() n'est pas du tout nécessaire selon la situation, onload et ready doivent être utilisés raisonnablement ;
Utilisez onload pour charger :
Copiez le code comme suit :
window.onload=fonction(){
var currentRenderer = 'javascript';
FusionCharts.setCurrentRenderer(currentRenderer);
var chartObj = nouveaux FusionCharts ({
swfUrl : "Pie3D.swf",
largeur : "290", hauteur : "210",
identifiant : 'sampleChart',
dataSource : "/ucenter/seo/new_seo_tool.php?check=xml&val={{pre_num}}",
format de données : FusionChartsDataFormats.XMLURL,
renderAt : 'chart1div'
}).rendre();
}
prêt
Il existe un événement appelé DOMContentLoaded dans le W3C, qui est déclenché lorsque le DOM (Document Object Model) est chargé.
Première méthode :
Copiez le code comme suit :
Semblable à $(function(){...}) $(document).ready(function(){...}) de Jquery
(fonction () {
var c'est à dire = !!(window.attachEvent && !window.opera);
var wk = /webkit//(/d+)/i.test(navigator.userAgent) && (RegExp.$1 < 525);
var fn = [];
var run = function () { for (var i = 0; i < fn.length; i++) fn[i]( };
var d = document ;
d. prêt = fonction (f) {
if (!ie && !wk && d.addEventListener)
return d.addEventListener('DOMContentLoaded', f, false);
if (fn.push(f) > 1) return ;
si (c'est-à-dire)
(fonction () {
essayez { d.documentElement.doScroll('left'); run( }
catch (err) { setTimeout(arguments.callee, 0 });
})();
sinon si (semaine)
var t = setInterval(fonction () {
si (/^(chargé|complet)$/.test(d.readyState))
clearInterval(t), run();
}, 0);
} ;
})();
Lorsque vous appelez :
document.ready(fonction(){
alerte('ok');
}
Deuxième méthode :
Copiez le code comme suit :
/Si W3C DOM2 est pris en charge, utilisez la méthode W3C
si (document.addEventListener){
document.addEventListener("DOMContentLoaded", te, false);
}
else if (/MSIE/i.test(navigator.userAgent)){/s'il s'agit d'un navigateur IE (non pris en charge)
/Créez une balise de script, qui a un attribut defer et qui sera chargée lors du chargement du document.
document.write("
var script = document.getElementByIdx_x("__ie_onload");
/Si le document est effectivement chargé, appeler la méthode d'initialisation
script.onreadystatechange = fonction() {
if (this.readyState == 'complete') {
te();
}
}
}
else if (/WebKit/i.test(navigator.userAgent)) {/S'il s'agit du navigateur Safari (non pris en charge)
/Créez un minuteur, vérifiez toutes les 0,01 secondes et appelez la méthode d'initialisation si le document est chargé
var _timer = setInterval( fonction() {
if (/loaded|complete/.test(document.readyState)) {
clearInterval(_timer);
te();
}
}, 10);
}
else {/Si aucune des réponses ci-dessus, utilisez la pire méthode (dans ce cas, Opera 7 s'exécutera ici)
window.onload = fonction(e) {
te();
}
}
fonction(){
alerte('ok');
}