## 将 html 解释成  js (virtual-dom 的定义)

### 关于 virtual DOM diff

这是一个标准 DOM 的属性
![](./_image/2016-07-26-16-39-16.jpg)
下面的  virtual DOM 的属性
```js
let element = {
    tagName: 'ul', // 节点标签名
    props: { // DOM的静态属性，不需要 watch 变更
        id: 'list'
    },
    dynamicProps: { // DOM的动态属性，需要 watch
        width: '80%'
    },
    events: { // 事件定义
        click: [
        ]
    },  
    children: [ // 该节点的子节点
        {tagName: 'li', props: {class: 'item'}, children: ["Item 1"]},
        {tagName: 'li', props: {class: 'item'}, children: ["Item 2"]},
        {tagName: 'li', props: {class: 'item'}, children: ["Item 3"]},
    ]
}
```


### 标签解释优先级
1.	`mc-for`
2.	`mc-if` `mc-unless`
3.	`mc-[attr]` `mc-on-[event]`
4.	`{x | [formatter] arg... | [formatter] arg...}` `{x}`
