導航:首頁 > 文件教程 > require引入2個js文件

require引入2個js文件

發布時間:2025-01-09 11:22:26

⑴ 怎麼在一個js文件中包含另一個JS文件

方法1:
document.write("引用的js路徑");
方法2:
使用第三方框架,比如requirejs

⑵ require同步載入是怎麼實現的

最早的時候,所有javascript代碼都寫在一個文件裡面,只要載入這一個文件就夠了。後來,代碼越來越多,一個文件不夠了,必須分成多個文件,依次載入。下面的網頁代碼,相信很多人都見過。
<script src="1.js"></script>
<script src="2.js"></script>
<script src="3.js"></script>
<script src="4.js"></script>
<script src="5.js"></script>
<script src="6.js"></script>
這段代碼依次載入多個js文件。
這樣的寫法有很大的缺點。首先,載入的時候,瀏覽器會停止網頁渲染,載入文件越多,網頁失去響應的時間就會越長;其次,由於js文件之間存在依賴關系,因此必須嚴格保證載入順序(比如上例的1.js要在2.js的前面),依賴性最大的模塊一定要放到最後載入,當依賴關系很復雜的時候,代碼的編寫和維護都會變得困難。
require.js的誕生,就是為了解決這兩個問題:

(1)實現js文件的非同步載入,避免網頁失去響應;
(2)管理模塊之間的依賴性,便於代碼的編寫和維護。
二、require.js的載入
使用require.js的第一步,是先去官方網站下載最新版本
下載後,假定把它放在js子目錄下面,就可以載入了。
<script src="js/require.js"></script>
有人可能會想到,載入這個文件,也可能造成網頁失去響應。解決辦法有兩個,一個是把它放在網頁底部載入,另一個是寫成下面這樣:
<script src="js/require.js" defer async="true" ></script>
async屬性表明這個文件需要非同步載入,避免網頁失去響應。IE不支持這個屬性,只支持defer,所以把defer也寫上。
載入require.js以後,下一步就要載入我們自己的代碼了。假定我們自己的代碼文件是main.js,也放在js目錄下面。那麼,只需要寫成下面這樣就行了:
<script src="js/require.js" data-main="js/main"></script>
data-main屬性的作用是,指定網頁程序的主模塊。在上例中,就是js目錄下面的main.js,這個文件會第一個被require.js載入。由於require.js默認的文件後綴名是js,所以可以把main.js簡寫成main。

⑶ 如何在一個js中引用多個js文件

可以創建一個函數叫require 該函數支持兩個參數

第一個參數 src 需要引入的script的路徑 (這個參數可以是路徑也可以是一個數組 多個js文件)

第二個回掉函數 在引入的script標簽載入完成了調用

因為樓主是引用js文件所以必須要在引入的js載入完成了才能運行後面的js

所以下面給出一份演示

<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8">
<title>e演示</title>
<scripttype="text/javascript">
functionrequire(src,fun){
functioncenterFun(O){
varnum=0;
for(vari=0;i<O.length;i++){
(function(j){
if(O[j].complate){
num++;
if(num==O.length){
if(fun){
fun();
}
}
}else{
O[j].onload=function(){
num++;
if(num==O.length){
if(fun){
fun();
}
}
}
}
})(i);
}
}
if(typeofsrc=="object"){
vard=newArray;
for(vari=0;i<src.length;i++){
vare=document.createElement("script");
document.body.appendChild(e);
e.setAttribute("src",src[i]);
d.push(e);
}
centerFun(d);
return0;
}
if(typeofsrc=="string"){
varscript=document.createElement("script");
script.setAttribute("src",src);
document.body.appendChild(script);
if(script.complate){
if(fun){
fun();
}
}else{
if(fun){
script.onload=function(){
fun()
script.onload=null;
}
}

}
}

}
</script>
</head>
<body>
<scripttype="text/javascript">
require(["http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"],function(){
console.log($);
})
</script>
</body>
</html>

該演示定義了一個函數require

可以看到代碼中並沒有script標簽 而是通過require引入的在載入完成過後我顯示了一下$說明函數已經將script載入完成了

閱讀全文

與require引入2個js文件相關的資料

熱點內容
聖魔之光石破解版本 瀏覽:110
湖北文件櫃多少錢一套 瀏覽:103
artlantis渲染器教程 瀏覽:679
360系統文件可以清理嗎 瀏覽:256
extjsform樣式 瀏覽:513
電信貓怎麼設置wifi密碼 瀏覽:785
p190文件用什麼打開 瀏覽:252
怎麼修改ps簽署文件 瀏覽:847
怎麼找到編程貓作品文件 瀏覽:647
鐵路局的網站是多少 瀏覽:194
微信雙號 瀏覽:926
招標文件中的凈值是什麼意思 瀏覽:675
有哪些app能借出5000 瀏覽:250
編程語言哪個發展好 瀏覽:974
刪除xp密碼 瀏覽:974
手機怎麼在word製作作業文件 瀏覽:489
工行銀行卡安全升級 瀏覽:807
桌面放的文件找不到 瀏覽:922
買學生票用什麼app 瀏覽:590
共建共享網路平台 瀏覽:39

友情鏈接