Comment introduire la bibliothèque jq locale lorsque jquery importe un CDN externe et ne parvient pas à se charger

Cet article présente principalement le chargement de CDN tiers par le site Web. Si la bibliothèque jQuery échoue, le code d'implémentation jquery local sera chargé. Les amis dans le besoin peuvent s'y référer

En raison de la situation. En raison de la prévalence des bibliothèques cdn tierces, de nombreux amis choisiront d'utiliser des bibliothèques de classes tierces. Du point de vue de l'apprentissage, il n'est pas recommandé à tout le monde d'utiliser des bibliothèques de classes. De cette façon, nous perdons beaucoup d'opportunités d'apprentissage. mais en termes d'utilisation, cela résout de nombreux problèmes de compatibilité de code, que je n'aborderai pas ici.

L'utilisation d'un CDN pour charger la bibliothèque de classes jQuery peut économiser de la bande passante et offrir aux utilisateurs une expérience de chargement de page plus rapide.

En raison du problème de la taille du site Web personnel et de la bande passante du CDN, bien que les coûts du CDN aient maintenant diminué, il arrive parfois que cela ne suffise pas. De nombreux amis choisiront d'utiliser des bibliothèques jquery tierces que je recommande personnellement. plusieurs Baidu et Sina nationaux, bootcdn

Le rôle des deux morceaux de code suivants est que si le jquery de cdn n'est pas chargé, nous pouvons utiliser la bibliothèque de classes locale.

Adresse de téléchargement jquery

Premier type : Utilisation recommandée

<script src="//apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
 if (typeof jQuery == &#39;undefined&#39;) {
 document.write(unescape("%3Cscript src=&#39;/skin/mobile/js/jquery.min.js&#39; type=&#39;text/javascript&#39;%3E%3C/script%3E"));
 }
</script>

Ci-dessus, nous a cité la bibliothèque jQuery de Baidu CDN, puis nous avons ajouté une instruction if après le code du script pour déterminer si la bibliothèque jQuery a été chargée avec succès. Si elle n'a pas été chargée avec succès, nous avons chargé dynamiquement la bibliothèque jQuery locale.

Parmi eux, nous utilisons directement le codage d'URL dans la méthode document.write, en codant "<" comme "%3C", puis nous utilisons la méthode unescape() pour restaurer la chaîne.

Nous reconvertissons la chaîne via la méthode unescape(), et nous pouvons voir que la sortie est un code de référence de script normal.

Maintenant, nous avons une question : "Pourquoi ne pas utiliser des caractères normaux, mais utiliser un codage de caractères ?" En fait, il y a une raison à cela, ce qui signifie que notre code pourra s'exécuter en XML, XHTML. ou HTML Il peut fonctionner normalement sans inclure le code dans CDATA (veuillez vous référer ici pour plus de détails).

Deuxième type :

<script src="http://lib.sinaapp.com/js/jquery11/1.8/jquery.min.js"></script>
<script>window.jQuery || document.write(unescape("%3Cscript src=&#39;/skin/mobile/js/jquery.min.js&#39; type=&#39;text/javascript&#39;%3E%3C/script%3E"))</script>

Le principe ci-dessus est le même que le premier, c'est-à-dire À travers || opérateur

Expression a || Expression b : Calcule le résultat de l'expression a (peut aussi être une fonction),

S'il s'agit de Fasle, exécute l'expression b (ou fonction), et renvoie le résultat de b;

si True, renvoie le résultat de a;

signifie que si window.jQuery est faux, la bibliothèque jquery locale est chargée.

requireJs n'a pas réussi à charger le js local après avoir cité cdn

Problème : trop de références js et css dans la page entraîneront un chargement lent de la page

                                                                  . Lors du passage au chargement cdn, les changements suivants. doivent être créés

1.jquery : ["https://cdn.bootcssddd.com/jquery/1.11.1/jquery.min","static/lib/jquery/jquery-1.9.1. min"],

2. Ajouté Le code build.js est le suivant

({
  baseUrl: "/js",
  paths: {
    "jquery": "empty:"
    
  },
  dir: "/js-build",
  optimize: "uglify",
  optimizeCss: "standard.keepLines",
  mainConfigFile: "config.js",//config.js为1中引用的文件
  removeCombined: true,
})

Ce qui précède est l'intégralité du contenu de cet article. Je j'espère que cela sera utile à l'apprentissage de tout le monde. Pour plus de contenu connexe, veuillez faire attention à PHP Chinese net !

Recommandations associées :

La fonction du bouton de commutation implémentée par jquery.onoff

À propos de jQuery pour l'ajout et la suppression dynamiques de données dans les formulaires Opérations

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!