Heim > Web-Frontend > js-Tutorial > So implementieren Sie JavaScript, um CSS- und JS-Dateien dynamisch zu laden. Javascript-Kenntnisse

So implementieren Sie JavaScript, um CSS- und JS-Dateien dynamisch zu laden. Javascript-Kenntnisse

WBOY
Freigeben: 2016-05-16 15:35:02
Original
1092 Leute haben es durchsucht

Das dynamische Laden von CSS-Dateien ist im Projekt erforderlich. Ich habe die Funktion zum dynamischen Laden von JS in ein Objekt integriert:

var dynamicLoading = {
  css: function(path){
 if(!path || path.length === 0){
  throw new Error('argument "path" is required !');
 }
 var head = document.getElementsByTagName('head')[0];
    var link = document.createElement('link');
    link.href = path;
    link.rel = 'stylesheet';
    link.type = 'text/css';
    head.appendChild(link);
  },
  js: function(path){
 if(!path || path.length === 0){
  throw new Error('argument "path" is required !');
 }
 var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.src = path;
    script.type = 'text/javascript';
    head.appendChild(script);
  }
}

Nach dem Login kopieren
Das

-Objekt enthält zwei völlig unabhängige Methoden, die zum Laden von CSS-Dateien bzw. JS-Dateien verwendet werden. Die Parameter sind die zu ladenden Dateipfade. Das Prinzip ist sehr einfach: Erstellen Sie verschiedene Knoten für verschiedene geladene Dateitypen, fügen Sie dann ihre jeweiligen Attribute hinzu und werfen Sie sie schließlich in das Head-Tag. Nach dem Test ist diese Methode mit allen Browsern kompatibel, sicher, ungiftig und umweltfreundlich und ein gängiger Code für die Arbeit von Webentwicklern.
Das Folgende ist der aufrufende Code, der äußerst einfach ist:

//动态加载 CSS 文件
dynamicLoading.css("test.css");

//动态加载 JS 文件
dynamicLoading.js("test.js");
Nach dem Login kopieren

Das Obige soll Ihnen erklären, wie Sie CSS- und JS-Dateien dynamisch in JavaScript laden. Ich hoffe, es wird Ihnen beim Lernen helfen.

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage