1、Ext实现了Ext.Element这个类来封装HTMLElement的对象，但是不可认为Ext.Element继承了HTMLElement，但是可以认为Ext.Element是HTMLElement的代替物
2、获取周边的元素
层次方法 作用
findParent() 定位于此节点，以此为起点，搜索外层的父节点，搜索条件必须符合并匹配传入的简易选择符
findParentNode() 定位于此节点，以此节点的父节点为起点，搜索外层的节点，搜索条件必须符合并匹配传入的简易选择
up() 沿着DOM，向外围搜索外层节点，搜索条件必须符合并匹配传入的简易选择
child() 基于送入的选择符，不限定深入的进行搜索，符合的话选取单个子节点
down() 基于该选择符，直接选取单个子节点
parent() 返回当前节点的那个父节点，可选的传入一个期待的选择符
next() 获取下一个侧边节点，跳过文本节点。可选的传入一个期待的选择符
prev() 获取上一个侧边节点，跳过文本节点。可选的传入一个期待的选择符
first() 获取第一个侧边节点，跳过文本节点。可选的传入一个期待的选择符
last() 获取最后一个侧边节点，跳过文本节点。可选的传入一个期待的选择符
获取周边节点的查询方法，表面上都以Ext.Element.*方法但是程序，实际上，维护元素DOM的方法的实质是委派Ext.DomHelper来完成的
3、元素的增删改查
键"key"名称的约定：
键名 约定
tag 标签名称，如div、span、table等
cls 元素样式类，可以接受多个样式类，空格分隔
children(cdn) 此值可为Array/Object类型，单个元素可以用Object类型定义子元素。可以不断嵌套子元素。如果不利用Dom Config定义子元素，可以使用html项的字符串定义子元素
html 文本内容，就是innerHTML属性
示例：
var list = Ext.DomHelper.append('testID',{
tag:'ul',cls:'my-list',cdn:[
{tag:'li',id:'item0',html:'List Item 0'},
{tag:'li',id:'item1',html:'List Item 1'}
]
});
DomHelper不支持解析标准类型的DOM元素对象，此时，我们用Ext.Element进行元素转换
var ml = new Ext.Element(document.createElement('div'));
document.body.appendChild(ml.dom);
var ml2 = new Ext.Element(document.createElement('div'));
Ext.getBody().appendChild(ml2.dom);
4、操作DOM的方法
| 语法 | 示例的片段 |
|
Ext.Element.appendChild() |
|
| Ext.Element.createChild() 传入一个DomHelper对象，将其创建并加入到该元素 可选的指定在其子元素之前的地方插入 |
|
| Ext.DomHelper.append() 创建新的DOM并将其加入到el元素中 |
|
| Ext.Element.appendTo() 把这个元素添加到送入的元素里 |
|
| Ext.DomHelper.overwrite() 创建新的DOM元素并覆盖el的内容 |
|
| Ext.Element.replace() 用于当前这个元素替换传入的元素 |
|
| Ext.DomHelper.insertBefore()/insertAfter() Ext.Element.insertBefore()/insertAfter() 传入元素的参数，并将该元素的DOM插入其后/之前 |
|
| Ext.Element.insertFirst() 插入或创建一个元素 作为该元素的第一个子元素 |
|
| Ext.Element.insertSibling() 插入(创建)一个元素或DomHelper配置项对象， 作为该元素的兄弟节点 |
|
| Ext.Element.remove() 从DOM里面删除该元素， 并从缓存中删除 |