RequireJS 插件

時間 2019-11-08

標籤 requirejs 插件欄目 JavaScript 简体版

原文原文鏈接

網址：http://www.requirejs.cn/docs/api.html#i18nhtml

RequireJS的插件：jquery

Text：自動加載一些非js的文本文件。api

domReady：確保在Dom Ready以後，執行須要與DOM交互的邏輯。dom

i18n ：語言的本地化ide

目錄結構：函數

例子：requirejs

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8"/>                
 5         <title>Hello The World!</title>        
 6         <script data-main="js/main" src="js/require.js" ></script>    
 7     </head>
 8     <body>    
 9         <button id="switch">Lady</button>
10         <div id="content">        
11         </div>                
12     </body>
13 </html>

index.html

 1 require.config({
 2     baseUrl: 'js',
 3     paths:{
 4         'Lady': 'template/Lady.html',        
 5         'Sir': 'template/Sir.html'
 6     }
 7 });
 8 
 9 
10 require(["jquery","domReady","text","text!Lady","text!Sir"],function($,domReady,text,Lady,Sir){                        
11     domReady(function(){
12         alert("Dom is ready!");
13         $("#content").html(Lady);    
14         $("#switch").click(function(){
15             if($("#switch").text() == "Lady")
16             {
17                 $("#switch").text("Sir");
18                 $("#content").html(Sir);
19             }
20             else
21             {
22                 $("#switch").text("Lady");
23                 $("#content").html(Lady);
24             }
25         });
26     });    
27 });

main.js

1 <div>
2     <br>Hello,Sir!<br>
3 </div>

Lady.html

1 <div>
2     <br>Hello,Lady!<br>
3 </div>

Sir.html

Text ：在依賴前加前綴：text! ,文本文件就會自動加載。ui

domReady：spa

　　1）例子中API嵌套的方式應避免；插件

　　2）以Loading Plugin語法加載，來強調在require回調函數以前，等待DOM Ready。Dom Ready會返回當前的doc。這種方式可能致使requirejs超時，能夠考慮

waitSeconds選項。

　　eg：require(["domReady!"],function(doc){}）;

相關標籤/搜索

每日一句

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