The sea.js of modularization development in JS

Advantages of modular Development:

1: conflict reduction

2: Improve Performance

Use Sea.js as an example: Sea.js Module Library: http://seajs.org/docs/#downloads

Example: getting modular development of non-inline styles:

　　

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >< HTML xmlns= "http://www.w3.org/1999/xhtml" ><script type= "Text/javascript" src= "Sea_js/sea.js" ></script><script>/*One: Introduce Sea.js file two: Define module three: Reference module four: module dependency*/        //the class library in the page call moduleWindow.onload=function(){            varOdiv=document.getelementbyid ("Div1"); /*the class library in the page call Module 1:seajs.use (first-argument,second-argument) first-argument: module The address of the file Second-argument: callback function, the parameter of the callback function is the external interface of the modulo file exports*/seajs.use ('./sea_js/getstyle.js ', function (ex) {alert (Ex.getstyle (odiv, ' width '))); })        }</script><style>#div1 {width:200px;height:200px;background:red;}</style>

Get non-inline style module file Getstyle.js:

//JavaScript Document//defines a function module that gets a non-inline styleDefinefunction(Require,exports,module) { 　/*
Require: module file Dependency interface
Exports: External File interface
Module
All three of them are going to be written.
*/            functionGetStyle (obj,attr) {if(obj.currentstyle) {returnObj.currentstyle[attr]; }    Else{                            returngetComputedStyle (obj,false) [attr];//non-IE under                    }                                }            //exports: External interface for calling modulesexports.getstyle=getstyle;//is like a method call in an object. });

Results obtained are: 200px;