avalonjs 0.5发布，迷你简单易用的MVVM框架

为了方便编写控件，本次升级就是整合了一个迷你的三百行的迷你jQuery进去。主要更新如下：

• 添加强大的UI绑定与自定扫描功能，让你一行JS也不用写生成UI。UI绑定的格式为ms-ui-opts?=uiName。 opts为VM中的对象名，uiName为控件名，UI会自动寻找data-id的值作为ViewModel的ID，然后你就可以在avalon.models[id]得到它。UI控件会优先使用data-*的值来作为UI的配置项，设计基本同bootstrap。
• ms-controller绑定，功能同angular的ng-controller，指定某个区域由某个ViewModel负责，没有找就定义在它上方的ViewModel。可以参见该文。
• ms-important绑定，指定某个区域只由某个ViewModel负责，没有就停止扫描。
• ms-options功能大幅增强。
• 迷你版jQuery。

现在应某些人的要求，列举一下API

---

静态方法与属性

• mix(a,b)， 相当于jQuery.extend
• models， 用于放置生成的ViewModel
• log(s)， 打印日志
• error(s)，抛出异常
• ui， 用于放置组件
• ready(fn), domReady，将回调延迟到DOM树后才执行
• oneObject(str|array, val?)， 如果传入一个字符串则将它以逗号转换为一个字符串数组，否则一定要传字符串数组，第二个参数可选，为生成的对象的值。此方法是用于生成一个键名不一样，但键值都一样的对象。如{a:1,b:1,c:1,d:1}
• type(obj), 返回传参的数据类型，值可能为Array, Date, Object, JSON, Number,String, Null, Undefined
• range(start, end, step)，生成一个整数数组，功能与underscorejs或python的同名函数一致。
• bind(el, type, fn, phase)，绑定事件，返回一个回调给你行卸载
• unbind(el, type, fn, phase)，卸载事件
• forEach，功能同jQuery.each， 都是索引值或键名在前，值或元素在后
• define(id?, deps?, factory)，定义一个ViewModel
• scan(element?, ViewModel?)，开始扫描DOM树，抽取绑定。

迷你jQuery对象

要求传入一个元素节点或文档对象或window，你可以通过$().element, $()[0]再次访问到你传入的东西。它有以下原型方法。

• hasClass(cls)，判定有没有此类名
• addClass(cls)，只有元素不存在时才添加此类名
• remvoeClass(cls)，移除类名
• toggleClass(cls, state?),切换类名，如果第2个参数为布名，则根据它强行添加或删除类名
• attr(name,value?)， 读写特性（此方法非常弱，直接使用setAttribute, getAttribute实现，没有做任何兼容性处理）
• data(name, value?)， 读写数据，使用HTML5的data-*特性实现。它会parse一下，让数据更为实现，思路同jQuery。
• removeData(name)， 移除数据
• css(name,value?)，读写样式，这个兼容性做得很好，因为长达一百行，连HTML5的私有前缀都能你补上。
• width(val?), 读写宽度，注意对隐藏元素没有处理。
• height(val?), 读写高度，注意对隐藏元素没有处理。
• bind(type, fn, phase)，绑定事件，这个没有做链式操作，目的是为了返回回调给你卸载。
• unbind(type,fn, phase)，卸载事件。
• val，读取表单元素的value值，功能同jQuery。
• offset，取得元素在文档中的坐标，功能只实现了jQuery的一半，只能读不能写。

各种绑定

• ms-html="str", 添加HTML
• ms-class-xxx="boolean", 切换类名
• ms-hover="className", 移上去时添加这类名，移出去掉。
• ms-visible="boolean", 操作元素的style.display实现显示隐藏
• ms-if="boolean", 决定是将此元素放出到DOM树还是移出
• ms-each-el?="array", el用于下面的引用，不写默认为$data。在它的作用范围，你还可以访问$index得到其索引值，$first判定是否第一个元素，$last是否最后一个，$remove为一个方法，你执行它就会从数组中删除它，并将它作用的那一片元素都移出DOM树。
• ms-model="property"，只能用于表单元素，与ViewModel中的某些字段双向绑定，它会偷偷绑定一些事件进行同步。情况与angular的ng-model相同。
• ms-controller="ViewModelName"，指定一个ViewModel的作用范围
• ms-important="ViewModelName"，指定这个区域只能由这个ViewModel来渲染
• ms-skip，不对此元素及后代进行扫描绑定，保证原样输出。
• ms-on-type="callback"，绑定一个事件，type为事件名，如ms-on-click="tick"。
• ms-click="callback",ms-keypress="callback",ms-keydown="callback", ms-keyup="callback",ms-mousedown="callback"……等常用事件都做了一个快捷方式。
• ms-disabled,ms-readyonly,ms-selected，ms-checked等布尔属性，根据属性值的情况决定添加与移除
• ms-enabled="boolean"，与ms-disabled相反。
• {{ expr }}, 插值表达式，与angular相同，可以使用“|filter(args1, args2)”的形式添加多个过滤器。
• ms-ui-opts?="name"，生成一个UI控件。opts为ViewModel中的一个对象属性，name为控件名。

ViewModel

• 与angular的要求一致，$开头的为框架所保留，由于在IE6-8中然后VBS实现，无法区分大小写，不要同一个ViewModel定义两个近似的方法名。
• $id为ViewModle的名字
• $events为一个对象，用于保存$watch方法的回调
• $watch(prop, callback)，ViewModel只能通知它的视图进行更新，不能通知他在ViewModel的其他属性，对于监控属性，我们可能通过这方法实现兄弟间的通信。
• $watch(prop,callback?)，停止通知
• 以$开头的属性，框架都不会将它转换为监控属性
• 放在$skipArray中的属性名，也不会转换为监控属性
• 一个包含get与set的对象被认为是一个计算属性。
• 数组会转换为监控数组，只监控长短与排序引发的变化。

大家可以到这里下载它或观看例子

新增的两个控件都是从jQuery插件改过来，一个由250行改到130行，一个由800行改到200行，MVVM的威力突显！

---

注意，v5中要求必须指定ms-controller或ms-important!