modulejs是极致模块化的且面向对象的javascript框架,modulejs能让你在简单易用的前提下写出更佳维护性和可重用性的javascript代码。
Features
- HTML document query/traversing/manipulation
- Lightweight selector engine
- Event handling
- Animation
- Cookie/localStorage storage
- Language extensions
- Ajax/JSONP request
- Template engine
- Rich utility class
modulejs 兼容全部主流浏览器 Internet Explorer 6+, Firefox 2+ (and browsers based on gecko) Chrome 4+, Safari 3+ and Opera9+.
modulejs quick example:
var ajax = module("net.Ajax").ajax;
ajax({
url:"localhost/ajaxdemo.php", //提交地址
form:"formName", //表单名称
timeout: 200, //过期时间
success: function(response){ //成功后回调函数
console.log(response);
}
});
Download
You can also clone the project with Git by running:
$ git clone git://github.com/yuanyan/modulejs
Open Source License
modulejs是免费并且开源的,基于目前最宽泛的MIT协议 ,你可以在项目中使用并修改modulejs的所有代码。
Guide
Note: 当前文档只适用于 modulejs 0.1.0
getting started
在使用modulejs之前我们须加载global.js,global.js是整个modulejs的核心与基础。
<script src="./global.js"> </script>
modulejs中一个很重要的概念就是按需加载, modulej不是像jQuery一样在使用前加载整个已经打包的一个js文件,而是加载模块的最小集合。关于为什么需要按需加载,modulejs认为这不仅可以减少服务器的流量,更重要的是因为按需加载页面的加载时间也会大幅缩短,最终对用户更友好。
modulejs通过下面方式加载模块:
module.load("lang.Base");
module.load("util.Uri");
module.load("net.Request");
module.load("net.Ajax");
or
module.load(["lang.Base","util.Uri","net.Request","net.Ajax"]);
模块加载是有依赖顺序的,而modulejs的极致模块化设计可以让我们很方便的管理各模块间的依赖关系,对于简单的依赖关系你可以选择手动维护模块间依赖关系,当然我们推荐你使用modulejs提供的工具来自动生成以免出错。
在moudlejs中module.load是异步加载module的,所以当需要调用一个module时,必须是在module加载完成之后。modulejs提供了onReady事件,只需注册onReady事件,需要执行的代码就会在module加载完成(ModuleReady)并且同时在整个页面文档加载完成(DOMReady)之后执行。
注册onReady事件:
module.onReady(function(){
var ajax = module("net.Ajax").ajax;
ajax({
url:"localhost/ajaxdemo.php", //提交地址
form:"formName", //表单名称
timeout: 200, //过期时间
success: function(response){ //成功后回调函数
console.log(response);
}
});
});
about module
在modulejs中"everything is module",一个实例对象可以是一个module,一个类可以是一个module,甚至一个函数也可以是一个module,在modulejs中所有代码都是通过module方式来组织的,这让我们非常方便的扩展modulejs,并且可以自由控制module的粒度。
下面例子是注册一个命名空间为"lang.String"的module :
module("lang.String",function(){
var LEFT = /^\s+/, RIGHT = /\s+$/;
var trim = function(str){
return str.replace(LEFT, "").replace(RIGHT, "");
};
...
//EXPOSE
return {
"trim":trim
};
});
当module注册后module会自动存储在模块仓库中进行管理。然后你通过moduel("namespace")来导入moduel。
如导入并使用已注册的命名空间为"lang.String"的module :
var trim = moduel("lang.String").trim;
var r = trim(" betrimed "); //r === "betrimed"
===============================================================
From http://madscript.com/modulejs/
分享到:
相关推荐
`modulejs`是一个专门针对JavaScript设计的模块化系统,它的主要目标是提供简单、高效且灵活的方式来管理和加载模块。作为一个轻量级的框架,`modulejs`不依赖任何其他库,这使得它可以在各种项目中轻松集成,无论是...
modulejs是极致模块化的且面向对象的javascript框架,modulejs能让你在简单易用的前提下写出更佳维护性和可重用性的javascript代码。 Features: •HTML document query/traversing/manipulation •Lightweight ...
modulejs是极致模块化的且面向对象的javascript框架,modulejs能让你在简单易用的前提下写出更佳维护性和可重用性的javascript代码。 标签:modulejs 分享 ...
本篇文章将深入探讨 JS 模块化及其在框架中的应用,特别适合那些需要处理较小规模项目的开发者。 首先,我们要理解什么是 JavaScript 模块。在编程领域,模块是一个自包含的代码单元,它封装了特定的功能或数据,并...
javascript模块化开发所以使用的 - seajs模块加载框架 Sea.JS 是一个遵循 CommonJS 规范的模块加载框架,可用来轻松愉悦地加载任意 JavaScript 模块。 SeaJS 支持的标准模块遵循 Modules/Wrappings 规范的 define ...
用于ES模块的简单的模块化JavaScript框架。 安装 npm install modujs 为什么 JavaScript所缺少的只是可以与DOM和ES模块以模块化方式无缝地工作。 自动初始化可见模块。 轻松调用其他模块的方法。 通过委派快速...
Sea.js是一款遵循CMD模块定义规范的JavaScript模块化开发框架。CMD(Common Module Definition)是一种模块定义规范,与AMD(Asynchronous Module Definition)类似,但是CMD更加适合于Node.js环境,并且在浏览器端...
一个javascript框架
MooTools 是一个简洁、模块化、面向对象的 JavaScript 框架。它能够帮助您更快、更简单地编写可扩展和兼容性强的 JavaScript 代码。MooTools 从 Prototype.js 中汲取了许多有益的设计理念,语法也和其极其类似。但它...
通过这个平台,开发者可以学习如何初始化框架、使用各种组件、处理用户事件以及与其他JavaScript库集成。API文档通常会涵盖以下几个关键部分: 1. **框架初始化**: Como1.0的启动过程,包括如何引入框架文件、配置...
**Node.js-Back2Front基于Express和XTemplate的模块化开发框架** 在现代Web开发中,Node.js以其异步非阻塞I/O模型和高效的性能,成为构建后端服务的热门选择。Back2Front是一个利用Node.js的强大特性,结合Express...
**模块化JS框架详解** 在JavaScript开发中,随着项目的复杂度不断提升,代码组织和管理变得愈发重要。模块化编程提供了一种有效的方式,使得代码结构清晰、可维护性增强,同时也便于团队协作。"modularJSFramework...
JavaScript模块化开发库之SeaJS 在Web开发中,JavaScript代码的组织和管理是一个重要的问题。随着项目的复杂性增加,代码的模块化变得至关重要。SeaJS便是一个专注于JavaScript模块化开发的库,它提供了一种在...
**Sea.js 模块化详解** Sea.js 是一个轻量级的前端模块加载器,它遵循 CommonJS 规范,并且特别适用于浏览器环境。Sea.js 的出现为前端开发者提供了一种组织和管理代码的新方式,使得大型应用的构建变得更加有序...
仿照 jquery源码编写的 简易框架的源码 出自的妙味课堂远程课
模块化框架意味着它们遵循模块化编程原则,允许开发者按需引入和组合不同的组件,从而降低项目的复杂性和依赖性。 描述中的“独立”可能指的是这些图库具有良好的平台兼容性,可以在不同的设备和浏览器上运行,包括...
JavaScript框架高级编程——应用Prototype、YUI、Ext JS、Dojo、MooTools JavaScript框架高级编程——应用Prototype、YUI、Ext JS、Dojo、MooTools
总的来说,JavaScript框架通过提供预包装的导航条组件和强大的路由系统,使得开发者可以快速构建功能丰富的网站,同时保持代码的整洁和模块化。无论你是初学者还是经验丰富的开发者,理解并熟练运用这些框架的导航...
Ember.js 是一个JavaScript框架,它极大地减少了构建任何 Web 应用程序所需的时间、精力和资源。它致力于通过完成大多数 Web 开发项目中涉及的所有常见、重复且至关重要的任务,帮助开发人员达成目标。 Ember.js是...