DomHelper和Template动态生成html
用dom生成html元素一直是头疼的事情，以前都是听springside的教导，使用jsTemplate和Scriptaculous的组合。现在到了ext里面，我们就来看看它自己的实现。
DomHelper用来生成小片段
使用DomHelper非常灵活，超简单就可以生成各种html片段，遇到复杂情况也要依靠于它。
大概就是这么用
var list = Ext.DomHelper.append('parent', {tag: 'div', cls: 'red'});
它就是向id=parent这个元素里，添加一个div元素。
按照文档里讲的，第二个参数{}里，除了四个特殊属性以外都会复制给新生成元素的属性，这四个特殊属性是
tag，告诉我们要生成一个什么标签，div啦，span啦，诸如此类。
千万别告诉我到现在你还不知道这些html标签，中间告诉你多少次先去学学html和css啦？你飞过来的不成？
cls，指的是<div class="red"></div>这种标签中的class属性，因为class是关键字，正常情况下应该写成className，可jack说className太长了，最后就变成cls了。-_-。
他就喜欢玩这个，把dataStore写成ds，DomHelper写成dh，Element写成el，ColumnModel写成cm，SelectionModel是sm。唉，发明的专业名词缩写好多呀。
children，用来指定子节点，它的值是一个数组，里边包含了更多节点。
html，对应innerHTML，觉得用children描述太烦琐，直接告诉节点里边的html内容也是一样。
DomHelper除了append还有几个方法，指定将新节点添加到什么位置。
为了比对效果，先放一个初始页面。
原始的html是这样的。一个div下有4个节点，其中第三个子节点下还有自己的子节点。
<div ;
}
};
t.compile();
显示的红男绿女，就像我们预想的那样呈现在我们眼前了。
用dom生成html元素一直是头疼的事情，以前都是听springside的教导，使用jsTemplate和Scriptaculous的组合。现在到了ext里面，我们就来看看它自己的实现。
DomHelper用来生成小片段
使用DomHelper非常灵活，超简单就可以生成各种html片段，遇到复杂情况也要依靠于它。
大概就是这么用
var list = Ext.DomHelper.append('parent', {tag: 'div', cls: 'red'});
它就是向id=parent这个元素里，添加一个div元素。
按照文档里讲的，第二个参数{}里，除了四个特殊属性以外都会复制给新生成元素的属性，这四个特殊属性是
tag，告诉我们要生成一个什么标签，div啦，span啦，诸如此类。
千万别告诉我到现在你还不知道这些html标签，中间告诉你多少次先去学学html和css啦？你飞过来的不成？
cls，指的是<div class="red"></div>这种标签中的class属性，因为class是关键字，正常情况下应该写成className，可jack说className太长了，最后就变成cls了。-_-。
他就喜欢玩这个，把dataStore写成ds，DomHelper写成dh，Element写成el，ColumnModel写成cm，SelectionModel是sm。唉，发明的专业名词缩写好多呀。
children，用来指定子节点，它的值是一个数组，里边包含了更多节点。
html，对应innerHTML，觉得用children描述太烦琐，直接告诉节点里边的html内容也是一样。
DomHelper除了append还有几个方法，指定将新节点添加到什么位置。
为了比对效果，先放一个初始页面。
原始的html是这样的。一个div下有4个节点，其中第三个子节点下还有自己的子节点。
<div ;
}
};
t.compile();
显示的红男绿女，就像我们预想的那样呈现在我们眼前了。