2015-04-23 2 views
2

Dans une autre question, StackOverflow a suggéré qu'il est impossible de garantir l'ordre dans lequel un navigateur traitera <script> balises, quelle que soit leur position dans les <head> ou <body> (voir les commentaires):

Scripts loading out of order in Chrome

début Réponse recommande d'utiliser un "DOM-loaded" pure-javascript pour garantir que toutes les dépendances sont chargées, puis exécuter du code spécifique à la page.

Cela me fait me demande s'il est sûr d'utiliser la fonction $ recommandée par jQuery comme substitut pour le pur-JS DOM chargé:

// Shorthand for $(document).ready() 
$(function() { 
    console.log("ready!"); 
}); 

Src: http://learn.jquery.com/using-jquery-core/document-ready/

Comment puis-je garantir $ la volonté de jQuery être défini?

EDIT: Des exemples d'échec hypothétique ont été demandés. Voici un avec le <script> externe <body>:

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Example 1</title> 
    </head> 
    <body> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
    <script> 
    $(function(){ 
     alert("Loaded."); 
    }); 
    </script> 
    </body> 
</html> 

Et l'un avec l'<script> externe <head> ...

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Example 1</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
    </head> 
    <body> 
    <script> 
    $(function(){ 
     alert("Loaded."); 
    }); 
    </script> 
    </body> 
</html> 

Basé sur Scripts loading out of order in Chrome, que ce soit d'entre eux peuvent échouer.

+8

Les scripts sont chargés dans l'ordre dans lequel ils sont rencontrés, sauf si vous avez défini le report ou l'asynchrone, donc ce n'est pas un problème. – adeneo

+0

http://stackoverflow.com/questions/1828237/check-if-jquery-has-been-loaded-then-load-it-if-false cette question est très similaire à la vôtre, et a de très bonnes réponses – JuniorDev

+1

@adeneo Ce n'est apparemment pas correct. S'il vous plaît voir "Scripts chargement dans le désordre dans Chrome" http://stackoverflow.com/questions/29785887/scripts-loading-out-of-order-in-chrome – Colin

Répondre

1

Cette question est basée sur une prémisse défectueuse. La question référencée, Scripts loading out of order in Chrome, concernait une application utilisant TurboLinks, qui transforme efficacement un site statique en une application d'une seule page. Par conséquent, mes balises <script> ont été insérées dynamiquement, et il n'y avait aucune garantie qu'elles seraient exécutées dans l'ordre.

0

Vous pouvez vérifier à plusieurs reprises si jQuery est chargé jusqu'à ce que ce soit le cas, à quel point vous exécutez du code.

<script> 
function doStuff() { 
    //do jQuery stuff 
} 

function checkLoaded() { 
    if(typeof jQuery == 'undefined') { 
     setTimeout(function() { 
     checkLoaded(); 
     }, 50); 
    } else { 
     doStuff(); 
    } 
} 

checkLoaded(); 
</script>