如何在Javascript中放置其他JavaScript文件鏈接？

Question

我在我的HTML模板的底部有一堆JavaScript鏈接。我想創建一個單獨的JavaScript文件，其中只包含所有源代碼鏈接。

因此，我不希望混淆我的模板頁腳，我想要在一個JavaScript文件中的所有鏈接。我怎樣才能做到這一點？

我真正要問的是如何才能獲得與JavaScript相似的CSS@import功能。

如果這是不可能的，我可以從一個不同的HTML文件在我的模板的頁腳放置一個HTML塊？

Answer 1

你可以這樣做與阿賈克斯，但一個簡單的方法是隻是追加他們用jQuery

$('.div').append('<script src="myscript.js"></script>'); 

希望幫助

Answer 2

您可以創建一個單獨的js文件並在它的object。這個對象可以有多個鍵，它們的值就是這些鏈接。從文件

希望返回此對象這個片段將是有益的

linkFile.js

var AllLinks = function(){ 
var _links ={}; 
_links.keyOne ="link1"; 
_links.keyTwo ="link2"; 
return { 
links:_links 
} 
} 

還包括使用script標籤 在其他文件這個文件你可以檢索這個值作爲

AllLinks.links.keyOne &等等

Answer 3

有一個包含指向腳本文件鏈接的數組，然後有兩個選項可以使用$.getScript()加載每個文件，或者通過構建HTML並將其附加到您的head或body標記。我傾向於使用head標記來保留所有腳本和css文件。

腳本的陣列文件使用上述辦法的$.getScript()

JsFiles.each(function(i,v){ 
    $.getScript(JsFiles[i], function(data, textStatus, jqxhr){ 
    console.log(textStatus); // Success 
    }); 
}); 

缺點

var JsFiles = ["script1.js","script2.js","script3.js","script4.js"]; 

第一種辦法是，getScript使得異步調用腳本文件這意味着如果script2.js是依賴於script1.js（例如，如果script1.js是一些使用初始化的插件文件，則在script2.js）然後您將面臨問題。

爲了克服你可能需要再使用Promises或寫在每個getScript成功函數的回調將觸發下一個腳本負載等..

如果腳本加載的順序並不那麼上面的方法很重要很好去。通過建立HTML

var scriptTags =""; 
JsFiles.each(function(i,v){ 
    scriptTags += "<script src='"+ JsFiles[i] +"'></script>"; 
}); 
$('head').append(scriptTags); 

好東西，對這種做法

第二種方法是腳本文件就會同步加載，你會不會面臨的依賴問題。但要確保獨立文件從第一個開始，依賴文件終於來臨。