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

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>");

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('test.js',function(){
 alert('done');
});

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('script');
 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('done');
 });

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!