18.findParent
定位于此节点，以此节点为起点，向外围搜索外层的父节点，搜索条件必须符合并匹配传入的简易选择符。
Ext.fly("elId").findParent("div");//返回dom节点
Ext.fly("elId").findParent("div",4);//查找4个节点
Ext.fly("elId").findParent("div",null,true);//返回Ext.Element
19.findParentNode
定位于此节点的“父节点”，以此节点的“父节点”为起点，向外围搜索外层的“父父”节点，搜索条件必须符合并匹配传入的简易选择符。
Ext.fly("elId").findParentNode("div");
20.up
沿着DOM，向外围搜索外层的“父父”节点，搜索条件必须符合并匹配传入的简易选择符。
Ext.fly("elId").up("div");
Ext.fly("elId").up("div",5);//限5层的内查找
21.select
传入一个CSS选择符的参数，然后依据该CSS选择符从当前元素下面，形成期待匹配子节点的集合，也就是“选择”的操作，最后以一个Ext.CompositeElement类型的组合元素的形式返回。如果以Ext.select()调用表示从document可是搜索。
//返回结果的CompositeElement
Ext.fly("elId").select("div:nth-child(2)");
//返回数组
Ext.fly("elId").select("div:nth-child(2)",
true);
//整个document都会搜索
Ext.select("div:nth-child(2)");
22.query
进行一次query的查询，返回DOM节点组成的数组。可选地第二参数设置为查询的起点，如不指定则为document。
//返回dom节点组成的数组
Ext.query("div:nth-child(2)");
23.child
基于送入的选择符，不限定深度进行搜索，符合的话选取单个子节点。
Ext.fly("elId").child("p.highlight");//返回的类型是Ext.Element
Ext.fly("elId").child("p.highlight",true);//返回dom节点
24.down
基于该选择符，"直接"选取单个子节点。
Ext.fly("elId").down("span");//返回的类型是Ext.Element
Ext.fly("elId").down("span",true);//返回dom节点

25.parent
返回当前节点的那个父节点，可选地可送入一个期待的选择符。
//返回父节点，类型是Ext.Element
Ext.fly("elId").parent();
//返回父节点，类型是htmldom
Ext.fly("elId").parent("",true);
//返回父级节点，但一定要是div的，找到就返回，类型是Ext.Element
Ext.fly("elId").parent("div");
26.next
获取下一个侧边节点，跳过文本节点。可选地可送入一个期待的选择符。
//返回下一个侧边节点，类型是Ext.Element
Ext.fly("elId").next();
//返回下一个侧边节点，类型是htmldom
Ext.fly("elId").next("",true);
//返回下一个侧边节点，但一定要是div的，找到就返回，类型是Ext.Element
Ext.fly("elId").next("div");
27.prev
获取上一个侧边节点，跳过文本节点。可选地可送入一个期待的选择符。
//返回上一个侧边节点，类型是Ext.Element
Ext.fly("elId").prev();
//返回上一个侧边节点，类型是htmldom
Ext.fly("elId").prev("",true);
//返回上一个侧边节点，但一定要是div的，找到就返回，类型是Ext.Element
Ext.fly("elId").prev("div");
28.first
获取第一个侧边节点，跳过文本节点。可选地可送入一个期待的选择符。
//返回第一个侧边节点，类型是Ext.Element
Ext.fly("elId").first();
//返回第一个侧边节点，类型是htmldom
Ext.fly("elId").first("",true);
//返回第一个侧边节点，但一定要是div的，找到就返回，类型是Ext.Element
Ext.fly("elId").first("div");
29.last
获取最后一个侧边节点，跳过文本节点。可选地可送入一个期待的选择符。
//返回最后一个侧边节点，类型是Ext.Element
Ext.fly("elId").last();
//返回最后一个侧边节点，类型是htmldom
Ext.fly("elId").last("",true);
//返回最后一个侧边节点，但一定要是div的，找到就返回，类型是Ext.Element
Ext.fly("elId").last("div");

四、DOM操控（DHTML常见的一项任务就是DOM元素的增、删、改、查）
30.appendChild
把送入的元素归为这个元素的子元素。
varel=Ext.get("elId1");
//用id指定
Ext.fly("elId").appendChild("elId2");
//Ext.Element添加
Ext.fly("elId").appendChild(el);
//选择符组合地添加
Ext.fly("elId").appendChild(["elId2","elId3"]);
//直接添加dom节点
Ext.fly("elId").appendChild(el.dom);
//添加CompositeElement，一组的div
Ext.fly("elId").appendChild(Ext.select("div"));
31.appendTo
把这个元素添加到送入的元素里面。
varel=Ext.get("elId1");
//"elId"添加到"elId2"里面
Ext.fly("elId").appendTo("elId2");
Ext.fly("elId").appendTo(el);//
添加到Ext.Elementel
32.insertBefore
传入一个元素的参数，将其放置在当前元素之前的位置。
varel=Ext.get("elId1");
//dom节点在前面插入
Ext.fly("elId").insertBefore("elId2");
//Ext.Elementel在前面插入
Ext.fly("elId").insertBefore(el);
33.insertAfter
传入一个元素的参数，将其放置在当前元素之后的位置。
varel=Ext.get("elId1");
//dom节点在后面插入
Ext.fly("elId").insertAfter("elId2");
//Ext.Elementel在后面插入
Ext.fly("elId").insertAfter(el);
34.insertFirst
可以是插入一个元素，也可以是创建一个元素（要创建的话请使用“DomHelper配置项对象”作为参数传入），总之，这个元素作为当前元素的第一个子元素出现。
varel=Ext.get("elId1");
//插入的dom节点作为第一个元素
Ext.fly("elId").insertFirst("elId2");
//插入的Ext.Element作为第一个元素
Ext.fly("elId").insertFirst(el);
//用DomHelper配置项创建新节点，新节点会作为第一个子元素被插入。
Ext.fly("elId").insertFirst({
tag:"p",
cls:"myCls",
html:"HiIamthenewfirstchild"
});
35.replace
用于当前这个元素替换传入的元素。
varel=Ext.get("elId1");
//"elId"去替换"elId2"
Ext.fly("elId").replace("elId2");
//"elId"去替换"elId1"
Ext.fly("elId").replace(el);
36.replaceWith
用传入的元素替换这个元素。参数可以是新元素或是要创建的DomHelper配置项对象。
varel=Ext.get("elId1");
Ext.fly("elId").replaceWith("elId2");//"elId2"替换掉"elId".
Ext.fly("elId").replaceWith(el);//
"elId1"替换掉"elId"
//用DomHelper配置项创建新节点，并用该节点换掉‘elId"。
Ext.fly("elId").replaceWith({
tag:"p",
cls:"myCls",
html:"HiIhavereplacedelId"
});


五、DomHelper配置项
37.createChild
传入一个DomHelper配置项对象的参数，将其创建并加入到该元素。
varel=Ext.get("elId");
vardhConfig={
tag:"p",
cls:"myCls",
html:"HiIhavereplacedelId"
};
//创建新的节点，放到"elId"里面
el.createChild(dhConfig);
//创建新的节点，居el第一个子元素之前
el.createChild(dhConfig,el.first());
38.wrap
创建一个新的元素，包裹在当前元素外面。
Ext.fly("elId").wrap();//div包着elId
//用新建的一个元素来包着elId
Ext.fly("elId").wrap({
tag:"p",
cls:"myCls",
html:"HiIhavereplacedelId"
});

六、Html片断
38.insertHtml
插入HTML片断到这个元素。至于要插入的html放在元素的哪里，你可指定beforeBegin,beforeEnd,afterBegin,afterEnd这几种。第二个参数是插入HTML片断，第三个参数是决定是否返回一个Ext.Element类型的DOM对象。
Ext.fly("elId").insertHtml(
"beforeBegin",
"<p><ahref="anotherpage.html">点击我</a></p>"
);//返回dom节点
Ext.fly("elId").insertHtml(
"beforeBegin",
"<p><ahref="anotherpage.html">点击我</a></p>",
true
);//返回Ext.Element
39.remove
从DOM里面移除当前元素，并从缓存中删除。.
Ext.fly("elId").remove();//
elId在缓存和dom里面都没有
40.removeNode
移除document的DOM节点。如果是body节点的话会被忽略。
Ext.removeNode(node);//从dom里面移除(HTMLElement)


七、Ajax
41.load
直接访问Updater的Ext.Updater.update()方法（相同的参数）。参数与Ext.Updater.update()方法的一致。
Ext.fly("elId").load({url:"serverSide.php"})
42.getUpdater
获取这个元素的UpdateManager。
varupdr=Ext.fly("elId").getUpdater();
updr.update({
url:"http://myserver.com/index.php",
params:{
param1:"foo",
param2:"bar"
}
});

八、事件控制EventHandling
43.addListener/on
为此元素加入一个事件处理函数。on()是其简写方式。简写方式作用等价，写代码时更省力。
varel=Ext.get("elId");
el.on("click",function(e,t){
//e是一个标准化的事件对象(Ext.EventObject)
//t就是点击的目标元素，这是个Ext.Element.
//对象指针this也指向t
});
44.removeListener/un
从这个元素上移除一个事件处理函数。un()是它的简写方式。
varel=Ext.get("elId");
el.un("click",this.handlerFn);
//或
el.removeListener("click",this.handlerFn);
45.Ext.EventObject
EventObject呈现了统一各浏览器的这么一个事件模型，并尽量符合W3C的标准方法。
//e它不是一个标准的事件对象，而是Ext.EventObject。
functionhandleClick(e){
e.preventDefault();
vartarget=e.getTarget();
...
}
varmyDiv=Ext.get("myDiv");
myDiv.on("click",handleClick);
//或
Ext.EventManager.on("myDiv","click",handleClick);
Ext.EventManager.addListener("myDiv","click",handleClick);

九、高级事件功能
46.委托delegation
要使用事件委托的方式代替，在容器身上登记一个事件处理器，按照依附的逻辑选择：
Ext.fly("actions").on("click,function(e,t){
switch(t.id){
case""btn-edit":
//处理特定元素的事件具体过程
break;
case"btn-delete":
//处理特定元素的事件具体过程
break;
case"btn-cancel":
//处理特定元素的事件具体过程
break;
}
});

47.委托化delegate
你在登记事件的处理器的时候可以加入配置这个选项。一个简易选择符，用于过滤目标元素，或是往下一层查找目标的子孙。
el.on("click",function(e,t){
//执行事件具体过程
},this,{
//对子孙"clickable"有效
delegate:".clickable"
});
48.翻转hover
这是一个Ext的翻转菜单的实例：
//handleswhenthemouseenterstheelement
functionenter(e,t){
t.toggleClass("red");
}
//handleswhenthemouseleavestheelement
functionleave(e,t){
t.toggleClass("red");
}
//subscribetothehover
el.hover(over,out);
49.移除事件句柄removeAllListeners
在该元素身上移除所有已加入的侦听器。
el.removeAllListeners();
50.是否一次性触发single
你在登记事件的处理器的时候可以加入配置这个选项。true代表为事件触发后加入一个下次移除本身的处理函数。
el.on("click",function(e,t){
//执行事件具体过程
},this,{
single:true//触发一次后不会再执行事件了
});
51.缓冲buffer
你在登记事件的处理器的时候可以加入配置这个选项。若指定一个毫秒数会把该处理函数安排到Ext.util.DelayedTask延时之后才执行。如果事件在那个事件再次触发，则原处理器句柄将不会被启用，但是新处理器句柄会安排在其位置。
el.on("click",function(e,t){
//执行事件具体过程
},this,{
buffer:1000//重复响应事件以一秒为时间间隔
});
52.延时delay
你在登记事件的处理器的时候可以加入配置这个选项。制定触发事件后处理函数延时执行的时间。
el.on("click",function(e,t){
//执行事件具体过程
},this,{
//延迟事件，响应事件后开始计时（这里一秒）
delay:1000
});
53.目标target
你在登记事件的处理器的时候可以加入配置这个选项。如果你想另外指定另外一个目标元素，你可以在这个配置项上面设置。这可保证在事件上报阶段中遇到这个元素才会执行这个处理函数。
复制代码代码如下: