Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie JQuery JS/CSS-Dateien dynamisch lädt

php中世界最好的语言
Freigeben: 2018-04-23 14:41:11
Original
1122 Leute haben es durchsucht

jqueryDie integrierte getSrcript-Datei kann nur JS-Code dynamisch laden, aber kein CSS. Später habe ich ein Programm geschrieben, das JS und CSS laden kann.

Schauen wir uns das zuerst an jquery selbst Die getSrscript-Datei mit der

Methode

$.getScript(url,callback)
Nach dem Login kopieren

Instanz

var testVar = 'New JS loaded!';
alert(testVar); function newFun(dynParam) {
alert('You just passed '+dynParam+ ' as parameter.');
}
Nach dem Login kopieren

ruft dynamisch die Methode

<script type="text/javascript" src="../jquery.js"></script>
<script type="text/javascript">
$(function()
{
$('#loadButton').click(function(){
$.getScript('new.js',function(){
newFun('"Checking new script"');//这个函数是在new.js里面的,当点击click后运行这个函数
});
});
});
</script>
</head>
<body>
<button type="button" id="loadButton">Load</button>
Nach dem Login kopieren

oben auf und kann nur dynamisch geladen werden js-Code, konnte aber CSS nicht laden. Später habe ich ein Programm geschrieben, das js und CSS laden konnte.

$.extend({
include
Path: '',
include: function(file)
{
var files = typeof file == "
string
" ? [file] : file;
for (var i = 0; i < files.length; i++)
{
var name = files[i].replace(/^s|s$/g, "");
var att = name.split(&#39;.&#39;);
var ext = att[att.length - 1].toLowerCase();
var isCSS = ext == "css";
var tag = isCSS ? "link" : "script";
var attr = isCSS ? " type=&#39;text/css&#39; rel=&#39;stylesheet&#39; " : " language=&#39;javascript&#39; type=&#39;text/javascript&#39; ";
var link = (isCSS ? "href" : "src") + "=&#39;" + $.includePath + name + "&#39;";
if ($(tag + "[" + link + "]").length == 0) 
document
.write("<" + tag + attr + link + "></" + tag + ">");
}
}
});
$.include(['hpbox.js','pop_win.css']);
Nach dem Login kopieren

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie auf der chinesischen PHP-Website Andere verwandte Artikel!

Empfohlene Lektüre:

Detaillierte Erläuterung der Schritte zum Implementieren des Datei-Uploads mit Jquery+LigerUI

Detaillierte Erläuterung des dynamischen Ladens von js durch jquery Dateien

Das obige ist der detaillierte Inhalt vonWie JQuery JS/CSS-Dateien dynamisch lädt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
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