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來獲取，底層是它