Extjs4.0中Core包中的Element的用法举例
第一：得到jsp页面中的dom对象的两种方法
1． 用Ext.core.Element下的fly方法来得到dom对象
var div01 = Ext.core.Element.fly("div01");//得到的是一个Element对象,可调用Element下的所有方法
//效果为：鼠标滑过的时候增加一个样式，移除的时候消除样式
div01.addClsOnOver("divColor");
注：divColor代表的是css样式
2． 用Ext.get来得到dom对象，get到的也是一个Element对象
var input01 = Ext.get("input01");
用方法来演示
（1）通过向输入框中输入的值判断
//addKeyMap是当想输入框中输出某个字节的时候可以调用函数，利用ajax的异步请求的方式来提示后面的效果
input01.addKeyMap({
key:Ext.EventObject.B,
ctrl:false,
fn:function(){
alert("您输入的是B")
},
scope : input01
});
（2）当文本框获得焦点的时候，按下键盘的某个键触发的事件
//addKeyListener可以在表单输入的时候提示按哪个快捷input01.addKeyListener({key:Ext.EventObject.X,ctrl:true},function(){
alert("您按下的是ctrl+x");
},input01);
（3）追加一个孩子节点
//appendChild是追加一个孩子节点 ,appendChild里写的是element的对象，通过dom声明element对象,用一个js函数来表示
Ext.get("div02").appendChild(createChild());
function createChild(){
var el = document.createElement("h1");
el.appendChild(document.createTextNode("我是被追加的 I am appendChild"));
return el;
}
（4）创建一个孩子节点
//创建一个节点
Ext.getBody().createChild({
tag:'select',
id:'city',
//创建节点的子节点
children :{
tag:'option',
id:01,
html:'julixian'
}
});
注：fly和get的作用是一样的，但是作用的原理不同，fly是直接从页面中取出dom，而get是从fly取出的节点再操作，如果fly不能取出节点，就由Ext.ComponentManager来获取，底层是它