# mofumui-R0508

**Repository Path**: mofum/mofumui-R0508

## Basic Information

- **Project Name**: mofumui-R0508
- **Description**: 一款基于JQuery，RequireJS框架的建立起来的具有面向对象特性的便于灵活组织各个组件的UI库。如果发现任何组件有问题，可以提交Issue，我们真诚与你沟通。
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: http://www.mofum.com/mofumui
- **GVP Project**: No

## Statistics

- **Stars**: 28
- **Forks**: 4
- **Created**: 2018-05-10
- **Last Updated**: 2024-11-08

## Categories & Tags

**Categories**: webui

**Tags**: None

## README

![MOFUM-UI](https://gitee.com/uploads/images/2018/0514/113955_2be0af3f_1183052.png "MofumUI设计.png")
一款基于JQuery，RequireJS框架的建立起来的具有面向对象特性的便于灵活组织各个组件的UI框架。用极少的代码和语言去组织网页内容。它是一个以JS渲染界面为主的界面库，也就是使用它你可以尽量避免写HTML,CSS代码。且很少关心浏览器的兼容问题。

虽然我们基于JQuery,但是我们并不是JQuery那种传统写法，只是运用它操作DOM。如果你非常喜欢JQuery的组织方式，我们也提供了相关的方法可以直接和JQuery进行互动。


 **使用方式** 

```
<script type="text/javascript" src="../../mofumui/mofumui.js" ></script>
```

 **第一个程序** 

```
<script type="text/javascript">
			
	//设置js的路由。
	mofum.setPrefix("../../");
	mofum.imports(["MFrame"],function(MFrame){
		
		//创建框架
		var frame = new MFrame("#f00");
		
		//设置文本
		frame.setContent("Hello World!");
		
	});
	
</script>
```

是的我们的例子很简单，因为这就是我们要做的事情。你可以像JAVA一样写代码。对此我们提供了一些API的Word文档和PPT，以便于你更快的理解。其他分支上有一些有趣的例子，比如贪吃蛇，轮播等等。这些例子会根据项目发布的进度进一步更改。除此之外，你还可以定义自己的组件。怎么定义组件，已经在custom目录有详细的例子说明。


 **MofumUI 的优点** 
 
- 面向对象的特性，使它的组件高度灵活可以继承修改重写，而不会影响整个框架的生态。

- 模块化编程，完全沿袭了 RequireJS 异步加载模块（遵循AMD规范）。你可以编写更加复杂且非常容易维护的单页应用。

- 我们的设计的组件代码量极少，极其方便阅读并且组件的兼容性十分良好，除极个别是HTML5标准，浏览器本身不支持的情况下。几乎可以做到最大化的兼容，部分组件甚至兼容IE5。

- 源代码极其简单，你在这个框架上几乎找不到什么高难度的、隐晦难懂的代码。当然你要有面向对象的编程思维（如果你学过JAVA这个应该不难）。

- 基于MIT协议，你完全可以商用，我们只奉行开源政策，但是使用它你必须自己承担一切风险责任（话说每个框架都是这样的）。

- 大量的基础组件，我相信你完全有能力进行二次开发。

- 学习成本十分低廉，入门门槛极低，用它的话你可以暂时不学CSS、HTML、LESS、SASS、WEBPACK、JQuery等等...。你就能可以做出非常好看，炫酷的网页。

- 可以采取多源加载各个模块，可以从根本上提高网页的加载速度。

- 我们的组件都可以用一句话形容，不仅仅只是...来形容。比如轮播，不仅仅只是图片轮播，它还可以轮播一些组件。再比如弹幕，不仅仅只是文字弹幕，它可以发送一些UI组件弹幕。