Maison > interface Web > js tutoriel > Résumé de trois façons de charger dynamiquement des fichiers JS

Résumé de trois façons de charger dynamiquement des fichiers JS

php中世界最好的语言
Libérer: 2018-05-12 14:35:41
original
2138 Les gens l'ont consulté

Cette fois, je vais vous présenter un résumé des trois façons de charger dynamiquement des fichiers JS. Quelles sont les précautions lors de l'utilisation des trois façons de charger dynamiquement des fichiers JS. Voici des cas pratiques, prenons un. regarder.

1. Utilisez la méthode document.write/writeln()

Cette méthode peut réaliser le chargement dynamique des fichiers js. pour recharger le fichier js. Écrire le flux de documents, cette méthode entraînera le redessin de la page entière.

document.writeln("<script src=\"http://lib.sinaapp.com/js/jquery/1.6/jquery.min.js\"></script>");
Copier après la connexion

Ce qu'il faut noter, c'est l'échappement du caractère spécial .

2. Utilisez jQuery

Utilisez la méthode getScript(url, callback) pour charger dynamiquement les fichiers js

$.getScript(&#39;test.js&#39;,function(){
 alert(&#39;done&#39;);
});
Copier après la connexion

3. Méthode js native

Principe : créer dynamiquement une balise de script et spécifier l'attribut src du script

function loadJs(url,callback){
 var script=document.createElement(&#39;script&#39;);
 script.type="text/javascript";
 if(typeof(callback)!="undefined"){
 if(script.readyState){
 script.onreadystatechange=function(){
  if(script.readyState == "loaded" || script.readyState == "complete"){
  script.onreadystatechange=null;
  callback();
  }
 }
 }else{
 script.onload=function(){
  callback();
 }
 }
 }
 script.src=url;
 document.body.appendChild(script);
 }
 loadJs("test.js",function(){
 alert(&#39;done&#39;);
 });
Copier après la connexion

Vous pouvez également utiliser le même principe pour charger dynamiquement des fichiers css, sauf que le nœud parent inséré est la balise head.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Explication détaillée du calcul de Vue.js et de l'utilisation des propriétés de l'écouteur

Chargement de jquery.js dans JS Explication détaillée de la méthode

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal