模塊化開發(seajs)

時間 2019-11-10

標籤模塊化開發 seajs 简体版

原文原文鏈接

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
<script type="text/javascript" src="js/sea.js"></script>
<script type="text/javascript">
//seajs  :http:seajs.org 官網
//seajs的使用：

//1  引入sea.js的庫
//2  如何變成模塊？
     //define
//3 如何調用模塊
      //exports
      //seajs.use
//4  如何依賴模塊？
     //require      
    
    //seajs.use:頁面去調用模塊，參數一：模塊的地址，參數二：地址加載成功後的回調函數 
    //seajs的默認根目錄：sea.js
    seajs.use('./javascript/test1.js',function(ex){//回調的參數就是模塊中的exports
    
      ex.tab(); //調用返回123
    
    });
</script>
</head>

<body>
</body>
</html>



//test1.js:
// JavaScript Document

define(function(require,exports,module){//參數固定,寫法不變
            //exports:     對外的接口
            
            //require :依賴的接口
            
            //require('./test2.js');//若是地址是一個模塊的話，那麼require的返回值就是模塊中的exports
            
            //require.async();  異步模式
              //require('./test2.js');
              
              require.async('./test2.js',function(ex){
                                ex.a;                  
                             })//異步調用，按需加載
              
                function tab()
                {
                     alert(require('./test2.js').a);
                }
            exports.tab=tab;    
})


//test2.js:

// JavaScript Document
//var a=10;


define(function(require,exports,module){//參數固定,寫法不變
            //exports:     對外的接口
            //require :依賴的接口
            
            var a=10;
            exports.a=a;
})

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。