IceMx.Mvc
IceMx.Mvc 我的js MVC 框架 开篇
开篇
这篇文章是后补的,前端时间想写一些对于js开发的一些理解,就直接写了,后来发现很唐突,所以今天在这里补一个开篇。
我的js Mvc 框架 基于实用设计,过分设计等于没设计。本着简单的原则,它只实现以下2点。
1、html代码、逻辑、数据处理的分离。
2、组件化
对于现在web页面交互性要求越来越强的情况,开发复杂的js段应用就必不可少。
就拿一个评论模块来讲,你可能要求它调用简单、参数可配置、组件化。
组件化就不用说了,你肯定不希望你写的代码到处复制了。
以前我自己写js组件的时候最原始的办法是把html代码 隐藏在页面里,用的时候show一下
后来发现这样的话每个页面都要写一堆隐藏代码
所以就改进一下,把html代码用js用字符串拼接出来,这样就可以再各个地方调用了。
但是后来发现这样的代码维护很困难,而且不利于阅读。
于是就先到了分离。
先来上一段组件调用代码

1 var discussController, FACE;
2
3 IceMx.Mvc.Get("Discuss","Face");
4
5 IceMx.Event.AddEvent("MvcLoadOver", function () {
6 FACE = new FaceController();
7 discussController = new DiscussController();
8 discussController.GetBody().appendTo("#panelDiscuss");
9 });

这是一个评论模块儿的调用,其实这里面包含了两个组件,我把评论里的表情也分离出来了,以后想其他地方加入表情只要new这个表情对象就ok了。
这样的调用实现了组件化。
再来看看目录结构
尤其是html代码的分离是很有必要的
框架会动态载入对应的控制器、模型、视图并且将视图绑定到控制器的变量内。
就先写这么多吧,随后会逐步完整共享出来,想法很浅薄,望高手提供宝贵意见。
其他
若有兴趣请关注分类下的其他文章,如果能得到您的支持将不甚感激。
IceMx.Mvc的更多相关文章
- IceMx.Mvc 我的js MVC 框架 三、动手来写一个评论模块儿
介绍 本人菜鸟,一些自己的浅薄见解,望各位大神指正. 本框架有以下优点 1.简单(调用简单.实现简单.不过度设计) 2.视图.控制器.模型分离(分离对于维护十分有必要) 3.组件化(每一个mvc模块儿 ...
- IceMx.Mvc 我的js MVC 框架 开篇
开篇 这篇文章是后补的,前端时间想写一些对于js开发的一些理解,就直接写了,后来发现很唐突,所以今天在这里补一个开篇. 我的js Mvc 框架 基于实用设计,过分设计等于没设计.本着简单的原则,它只实 ...
- IceMx.Mvc 我的js MVC 框架五、完善植物大战僵尸(雏形版增加动画)
有图有真相 说明 实在找不到僵尸的素材,从网上扒了一个山寨的僵尸,只有4张的一个连续图片,所以动作有点僵硬,植物的图片是自己处理的,非专业所以……咳咳!. 背景是自己抠下来2块儿拼接的,看在这么辛苦的 ...
- IceMx.Mvc 我的js MVC 框架 二、视图的数据绑定
介绍 本人菜鸟,一些自己的浅薄见解,望各位大神指正. 本框架有以下优点 1.简单(调用简单.实现简单.不过度设计) 2.视图.控制器.模型分离(分离对于维护十分有必要) 3.组件化(每一个mvc模块儿 ...
- IceMx.Mvc 我的js MVC 框架四、试水植物大战僵尸(雏形版)
有图有真相 开始 最近老婆在家迷上了植物大战僵尸,每天回去躺床上就玩,有一天居然跟我说冰箱后边爬着好几只僵尸,当时我就惊呆了,后来才知道她是在说蟑螂,我去. 闲言少叙,书归正传,这是一个雏形,没有在界 ...
- IceMx.Mvc 我的js MVC 框架 一、html代码的分离(视图)
介绍 本人菜鸟,一些自己的浅薄见解,望各位大神指正. 本框架有以下优点 1.简单(调用简单.实现简单.不过度设计) 2.视图.控制器.模型分离(分离对于维护十分有必要) 3.组件化(每一个mvc模块儿 ...
- IceMx.Mvc 我的js MVC 框架七、完善植物大战僵尸(增加阳光的消费和获得)
话不多说,先上图 这次增加了阳光的消费和获得,增加了阳光的点击动画 重新排布了布局 有兴趣的话就研究下吧. 上一篇有朋友说让我把项目放到github上面维护,本人没用过这个,肯请朋友们帮小弟科普一下放 ...
- IceMx.Mvc 我的js MVC 框架六、完善植物大战僵尸(向日葵登场)
有图有真相,废话不多说上图 看到园友的支持很受鼓舞,更觉得应该做下去,虽然自己是个菜鸟,但也应该共享自己的心得,只要有人获益那就是值得的. 我的下载需要csdn论坛的1个积分,之所以不完全免费出去是因 ...
- 【人在江湖飘,哪有不带刀】神器Jumony
大神博客:http://www.cnblogs.com/Ivony/p/3447536.html 项目地址:https://github.com/Ivony/Jumony 1.安装Jumony包 在N ...
随机推荐
- 操作jQuery集合搜索父元素
搜索父元素 1.1parents()方法 parents()方法用于获取u当前匹配元素集合中的每个元素的祖先元素,根据需要还可以使用一个选择器进行筛选parents([selector]) 其中sel ...
- 高效率的Shell
1. 批量将Excel转为CSV文件 XLSX2CSV: https://github.com/dilshod/xlsx2csv sudo easy_install xlsx2csv #安装Xlsx2 ...
- jQuery的ajax对WebApi和OData的封装
基于jQuery的ajax对WebApi和OData的封装 WebApi 的使用带来了一个显著的特点,对type有一定的要求.一般ajax的type无非就是两种,GET和POST.如果用JSONP来跨 ...
- Windows下一个ROracle安装与使用
ROracle一个简短的引论: ROracle这是R连接到接入Oracle数据库DBI(Oracledatabase interface)介面.这是基于OCI一个DBI兼容Oracle司机. 具体见说 ...
- 编译预处理 -- 带参数的宏定义--【sky原创】
原文:编译预处理 -- 带参数的宏定义--[sky原创] 如有转载请注明出处 编译预处理 -- 带参数的宏定义 前面为输出文件,后面为输入文件 gcc -E -o test.i test.c ...
- Java之String类的使用细节
String类的特点: 字符串对象一旦被初始化就不会被改变,字符串存储在字符串常量池中(字符串缓冲区).如果池中没有就创建,如果有就直接拿过来用. 代码验证如下: String s ...
- Android基础笔记(十)- 帧动画、补间动画具体解释、对话框
帧动画 补间动画Tween Animation 对话框以及面试中的注意点 帧动画 帧动画非常easy,我们首先看一下Google官方解释This is a traditional animation ...
- 开发者需要了解的WebKit
2013-3-22 22:37| 发布者: sxwgf| 查看: 575| 评论: 0|来自: infoq 摘要: Paul Irish是著名的前端开发工程师,同时他也是Chrome开发者关系团队成员 ...
- Spring之IOC容器加载初始化的方式
引言 我们知道IOC容器时Spring的核心,可是如果我们要依赖IOC容器对我们的Bean进行管理,那么我们就需要告诉IOC容易他需要管理哪些Bean而且这些Bean有什么要求,这些工作就是通过通过配 ...
- leetcode第28题--Divide Two Integers
Divide two integers without using multiplication, division and mod operator. 分析:题目意思很容易理解,就是不用乘除法和模运 ...