生成AST(二)-流程
<div id="app"><span disabled="false">{{message}}</span></div>
以上面html代码为例子来说明整个流程运转
栈变化图
各项指标变化表
| 循环次数 | 操作 | stack | html |
|---|---|---|---|
| 1 | 匹配到了开始标签div,入栈 | div dom | <span disabled="false">{{message}}</span></div> |
| 2 | 匹配到了开始标签span,入栈 | span dom div dom | {{message}}</span></div> |
| 3 | 匹配到了文本信息{{message}},将文本节点信息添加到span的children中 | span dom div dom | </span></div> |
| 4 | 匹配到结束标签span,出栈 | div dom | </div> |
| 5 | 匹配到结束标签div,出栈 | 空 | 空,循环结束 |