Javascript - Comment détecter si le document est chargé (IE 7 et Firefox 3)

Il n'y a pas besoin de tout le code mentionné par galambalazs. La croix-navigateur de façon à le faire en JavaScript est simplement pour tester document.readyState:

if (document.readyState === "complete") { init(); }

C'est aussi comment jQuery t-il.

Selon l'endroit où le JavaScript est chargé, ce qui peut être fait à l'intérieur d'un intervalle:

var readyStateCheckInterval = setInterval(function() {
    if (document.readyState === "complete") {
        clearInterval(readyStateCheckInterval);
        init();
    }
}, 10);

En fait, document.readyState peut avoir trois états:

Retourne "chargement en cours" alors que le document est en cours de chargement, "interactif" une fois qu'il est fini de l'analyse, mais encore de chargement de sous-ressources, et "terminer" une fois il a chargé.
-- document.readyState à Mozilla Developer Network

Donc, si vous avez seulement besoin du DOM pour être prêt, vérifier document.readyState === "interactive". Si vous avez besoin de l'ensemble de la page pour être prêt, y compris les images, vérifiez document.readyState === "complete".

Vous voudrez probablement utiliser quelque chose comme jQuery, ce qui rend JS programmation plus facile.

Quelque chose comme:

$(document).ready(function(){
   //Your code here
});

Semble faire ce que vous êtes après.

Si vous voulez vraiment que ce code fonctionne à charge, pas à domready (c'est à dire que vous devez les images à charger ainsi), puis, malheureusement, la fonction ready ne pas le faire pour vous. En général, je viens de faire quelque chose comme ceci:

Inclure dans le document javascript (c'est à dire toujours appelé avant onload tiré):

var pageisloaded=0;
window.addEvent('load',function(){
 pageisloaded=1;
});

Puis votre code:

if (pageisloaded) {
 DoStuffFunction();
} else {
 window.addEvent('load',DoStuffFunction);
}

(Ou l'équivalent dans votre cadre de préférence). J'utilise ce code pour faire la mise en cache préalable de javascript et les images pour les futures pages. Depuis les choses que je reçois n'est pas utilisé pour cette page à tous, je n'en veux pas à prendre le pas sur la rapidité de téléchargement d'images.

Il peut y avoir une meilleure façon, mais je n'ai pas encore trouver.

Ci-dessus, on avec JQuery est la méthode la plus simple et la plupart du temps utilisé de façon. Cependant, vous pouvez utiliser javascript, mais d'essayer de définir ce script dans l'en-tête de sorte qu'il est lu au début. Ce que vous cherchez est window.onload événement.

Ci-dessous est un simple script que j'ai créé pour exécuter un compteur. Le comptoir puis s'arrête au bout de 10 itérations

window.onload=function()
{
    var counter = 0;
    var interval1 = setInterval(function()
    { 
        document.getElementById("div1").textContent=counter;
        counter++; 
        if(counter==10)
        {
            clearInterval(interval1);
        }
    },1000);

}

J'ai une autre solution, mon application doivent être démarré lorsque le nouvel objet de MyApp est créé, de sorte qu'il ressemble:

function MyApp(objId){
     this.init=function(){
        //.........
     }
     this.run=function(){
          if(!document || !document.body || !window[objId]){
              window.setTimeout(objId+".run();",100);
              return;
          }
          this.init();
     };
     this.run();
}
//and i am starting it 
var app=new MyApp('app');

il fonctionne sur tous les navigateurs, qui, je le sais.