Javascript Girl
  1. Javascript Girl
  3. Chargement jQuery à la volée
Intereting Posts
Formatage des nombres à virgule flottante sans perte de précision dans AngularJS Utilisation de pdf.js pour afficher le pdf à partir des données brutes Tag de script dans angular2 template / hook lorsque le modèle dom est chargé Comment éliminer le "scintillement" après le rendu? Dupliquer l'iframe: Copier la tête et le corps de 1 iframe à l'autre Déterminer la distance du haut d'un div au sommet de la fenêtre avec javascript Comment créer l'effet Super Saiyan dans CSS / JS? MVC 3: l'exécution de javascript après la validation a été terminée mais avant la publication actuelle? RequireJS: problème incluant le paquet d'assouplissement de jquery après l'optimisation Comment passer une image dans une bibliothèque HTML Configurez le webpack pour permettre le débogage du navigateur Animation en javascript natif Bootstrap 3 affix navbar devient transparent et non réglable lors du défilement et du chevauchement du contenu Ajouter des heures à l'objet Date de Javascript? Javascript 'cette' valeur change, mais ne peut pas comprendre pourquoi

Chargement jQuery à la volée

Je ne peux pas comprendre ce qui ne va pas avec mon code ici. J'essaie de charger dynamiquement jQuery s'il n'est pas présent sur la page. 

<head> <script> (function() { if (typeof jQuery != 'undefined') { /* jQuery is already loaded... verify minimum version number of 1.4.2 and reload newer if needed */ if (/1\.(0|1|2|3|4)\.(0|1)/.test(jQuery.fn.jquery) || /^1.1/.test(jQuery.fn.jquery) || /^1.2/.test(jQuery.fn.jquery)|| /^1.3/.test(jQuery.fn.jquery)) { loadJQ(); } } else { loadJQ(); } function loadJQ() { /* adds a link to jQuery to the head, instead of inline, so it validates */ var headElement = document.getElementsByTagName("head")[0]; linkElement=document.createElement("script"); linkElement.src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"; linkElement.type="text/javascript"; headElement.appendChild(linkElement); //alert(headElement); } })(); </script> </head>

C'est mon corps. 

  <body> <button>Click me</button> <script type="text/javascript"> $(document).ready(function(){ alert("hello"); $("button").click(function(){ $(this).hide(); }); }); </script> </body>

Lorsque je l'ai mis dans une page html, j'ai une erreur indiquant que "$ n'est pas défini". Quelqu'un a-t-il une idée de pourquoi?

"$ N'est pas défini" signifie que jquery n'est pas chargé.

Essayez ce script pour charger le jquery.

http://css-tricks.com/snippets/jquery/load-jquery-only-if-not-present/

Les résultats d'erreur "$ is not defined" du code jQuery ne sont pas téléchargés au moment où le script tente d'exécuter.

Vous pouvez essayer d'utiliser l'attribut Script pour différer l'exécution de votre code jusqu'à ce qu'il soit chargé en changeant la balise du script vers 

  <script type="text/javascript" defer="defer">

Avec l'aide de mon ami, j'ai trouvé quel problème avec le code ci-dessus.

Lorsque le document est déjà exécuté, jquery n'est pas sur la page (il y a deux éléments onReady en cours d'exécution) … et puisque la version addToHead est non bloquante, le reste du javascript s'exécute en parallèle et échoue.

Je l'ai ajouté juste après que la balise du corps commence et ça marche bien: 

 <script type="text/javascript"> if (typeof jQuery == 'undefined') { document.write('<scr'+'ipt type="text/javascript" src="http://ajax.googleapis.com /ajax/libs/jquery/1.7.1/jquery.min.js">'+'</scr'+'ipt>'); } </script>