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); } }
-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");
Das Obige soll Ihnen erklären, wie Sie CSS- und JS-Dateien dynamisch in JavaScript laden. Ich hoffe, es wird Ihnen beim Lernen helfen.