Maison > interface Web > js tutoriel > le corps du texte

Résumé du code de quatre méthodes de chargement dynamique JavaScript couramment utilisées

伊谢尔伦
Libérer: 2017-07-21 15:55:05
original
2424 Les gens l'ont consulté

Parfois, nous devons ajouter dynamiquement des js appropriés, car parfois nous n'avons pas besoin de charger tous les js pour améliorer l'efficacité Voici 4 méthodes couramment utilisées

1. . Direct document.write

<script language="javascript"> 
document.write("<script src=&#39;test.js&#39;><\/script>"); 
</script>
Copier après la connexion

2. Modifier dynamiquement l'attribut src d'un script existant

<script src=&#39;&#39; id="s1"></script> 
<script language="javascript"> 
s1.src="test.js" 
</script>
Copier après la connexion

3. Créer dynamiquement. éléments de script

<script> 
var oHead = document.getElementsByTagName(&#39;HEAD&#39;).item(0); 
var oScript= document.createElement("script"); 
oScript.type = "text/javascript"; 
oScript.src="test.js"; 
oHead.appendChild( oScript); 
</script>
Copier après la connexion

Ces trois méthodes sont toutes exécutées de manière asynchrone

4. Principe : Utiliser XMLHTTP obtient le contenu à scripté et crée un objet Script.
Remarque : a.js doit être enregistré en codage UTF8 pour éviter les erreurs. Parce que le serveur et XML utilisent le codage UTF8 pour transmettre les données.
Code de la page principale :

<script language="JavaScript"> 
function GetHttpRequest() 
{ 
if ( window.XMLHttpRequest ) // Gecko 
return new XMLHttpRequest() ; 
else if ( window.ActiveXObject ) // IE 
return new ActiveXObject("MsXml2.XmlHttp") ; 
} 
function AjaxPage(sId, url){ 
var oXmlHttp = GetHttpRequest() ; 
oXmlHttp.OnReadyStateChange = function() 
{ 
if ( oXmlHttp.readyState == 4 ) 
{ 
if ( oXmlHttp.status == 200 || oXmlHttp.status == 304 ) 
{ 
IncludeJS( sId, url, oXmlHttp.responseText ); 
} 
else 
{ 
alert( &#39;XML request error: &#39; + oXmlHttp.statusText + &#39; (&#39; + oXmlHttp.status + &#39;)&#39; ) ; 
} 
} 
} 
oXmlHttp.open(&#39;GET&#39;, url, true); 
oXmlHttp.send(null); 
} 
function IncludeJS(sId, fileUrl, source) 
{ 
if ( ( source != null ) && ( !document.getElementById( sId ) ) ){ 
var oHead = document.getElementsByTagName(&#39;HEAD&#39;).item(0); 
var oScript = document.createElement( "script" ); 
oScript.language = "javascript"; 
oScript.type = "text/javascript"; 
oScript.id = sId; 
oScript.defer = true; 
oScript.text = source; 
oHead.appendChild( oScript ); 
} 
} 
AjaxPage( "scrA", "b.js" ); 
alert( "主页面动态加载JS脚本。"); 
alert( "主页面动态加载a.js并取其中的变量:" + str ); 
</script>
Copier après la connexion

Maintenant, le chargement dynamique d'un script JS est terminé.

var Rash=true; 
var msg=""; 
function norash() 
{ 
if (confirm("确定要取消吗")) 
Rash=false; 
} 
function rashit() 
{ 
setInterval(&#39;getrss()&#39;,Inttime); 
} 
function getrss() 
{ 
if (Rash==true) 
{ 
head=document.getElementsByTagName(&#39;head&#39;).item(0); 
script=document.createElement(&#39;script&#39;); 
script.src=&#39;INCLUDE/AutoUpdate.asp&#39;; 
script.type=&#39;text/javascript&#39;; 
script.defer=true; 
void(head.appendChild(script)); 
window.status=msg; 
} 
} 
rashit();
Copier après la connexion

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
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!