常用工具類和函數。
1. Ext.onReady()
|
Ext.onReady(function(){ Ext.MessageBox.alert("大家好","讓我們回味一下!!"); }); |
2. Ext.get()
get方法用來得到一個Ext元素，也就是類型爲Ext.Element的對象， Ext.Element類是Ext對DOM的封裝，代表DOM的元素，可以爲每一個DOM創建一個對應的Element對象，可以通過Element對象 上的方法來實現對DOM指定的操作，比如用hide方法可以隱藏元素、initDD方法可以讓指定的DOM具有拖放特性等。get方法其實是 Ext.Element.get的簡寫形式。
|
Ext.onReady(function(){ alert(Ext.get("test")); alert(Ext.get("test").dom.innerHTML); }); |
|
Ext.onReady(function(){ alert(Ext.get(document.getElementById("test")).dom.innerHTML); });
|
|
Ext.onReady(function(){ alert(Ext.get((new Ext.Element("test"))).dom.innerHTML); });
|
|
Ext.onReady(function(){ //Ext.get("test").hide();//隱藏 Ext.get("test").highlight()//高亮顯示 Ext.get("test").setX(200);//x座標位置 Ext.get("test").setY(200);//y座標位置 }); |
3. Ext.select ()
select方法可以用來獲得指定標籤的DOM對象，其返回值是一個Ext.CompositeElement對象。
|
Ext.onReady(function(){ Ext.select("div").each(function(e){ alert(e.dom.innerHTML); }) }); |
4. Ext.query ()
query方法和select方法非常類似，不同的是，它返回的是一個數組，它是Ext.DomQuery.select()的簡寫方式。
|
Ext.onReady(function(){ var arr = Ext.query("div"); for(var i = 0; i < arr.length; i++) { alert(arr[i].innerHTML); } }); |
|
Ext.onReady(function(){ var arr = Ext.query("#test1");//選擇元素id爲test1的節點的數組 alert(arr.length); }); |
|
Ext.onReady(function(){ var arr = Ext.query(".hello");// 通過class name來獲取節點的數組 alert(arr.length); }); |
|
Ext.onReady(function(){ var arr = Ext.query("*");//這會返回一個數組，包含文檔的所有元素 alert(arr.length); }); |
|
Ext.onReady(function(){ var arr = Ext.query("div p");//這會返回有一個元素的數組，包含p標籤的div標籤 alert(arr.length); }); |
|
Ext.onReady(function(){ var arr = Ext.query("*[class=hello]");//這會得到class等於"hello"的所有元素 alert(arr.length); }); |
|
Ext.onReady(function(){ var arr = Ext.query("*[class!=hello]");//這會得到class不等於"hello"的所有元素 alert(arr.length); }); |
5.Ext.getCmp()
getCmp方法用來獲得一個Ext組件，也就是一個已經在頁面中初始化了的Component或其子類的對象，getCmp方法其實是Ext.ComponentMgr.get方法的簡寫形式。getCmp方法中只有一個參數，也就是組件的id。
|
Ext.onReady(function(){
var myPanel = new Ext.Panel({ id:"myPanel", renderTo:"showPanel", Html:"Hello,EveryOne!", title:" " });
Ext.getCmp("myPanel").setWidth(800); Ext.getCmp("myPanel").setHeight(300); Ext.getCmp("myPanel").setTitle("標題"); }); |
6. Ext.getDom()
getDom方法能夠得到文檔中的DOM節點，該方法中包含一個參數，該參數可以是DOM節點的id、DOM節點對象或DOM節點對應的Ext元素(Element)等。
|
Ext.onReady(function(){ alert(Ext.getDom("test").innerHTML) }); |
|
Ext.onReady(function(){ alert(Ext.getDom(new Ext.Element("test")).innerHTML); }); |
|
Ext.onReady(function(){ var e = new Ext.Element("test"); alert(Ext.getDom(e.dom).innerHTML); }); |
7.Ext. getBody()
方法直接得到文檔中與document.body這個DOM節點對應的ExtJS元素（Element），實質就是把document.body對象封裝成ExtJS元素對象返回，該方法不帶任何參數。
|
Ext.onReady(function(){ new Ext.Panel({ renderTo:Ext.getBody(), id:"panel", title:"panel" }) }); |
8.Ext. getDoc()
getDoc方法實質上就是把當前html文檔對象，也就是把document對象封裝成ExtJS的Element對象返回，該方法不帶任何參數。
9. Ext.isEmpty()
判斷對象是否爲空，當判斷字符串時如果第二個參數不不同時結果也會不同，第二個參數表示'是否允許字符串爲空'。
|
Ext.onReady(function(){ var panel = new Ext.Panel({ renderTo:Ext.getBody(), id:"panel", title:"panel" });
var hi = null;
alert(Ext.isEmpty(hi)); }); |
|
Ext.onReady(function(){ var str = "123"; var str2 = ""; var str3 = null;
alert(Ext.isEmpty(str,true)); //允許爲空 alert(Ext.isEmpty(str2,true)); //允許爲空 alert(Ext.isEmpty(str3,true)); //允許爲空
alert(Ext.isEmpty(str,false)); //不允許爲空 alert(Ext.isEmpty(str2,false)); //不允許爲空 alert(Ext.isEmpty(str3,true)); //不允許爲空 }); |
10.Ext.each()方法。
遍歷數組。
|
Ext.onReady(function(){ var arr = [1,2,3,4,5]; Ext.each(arr,function(item,index,allItems){ alert(item); }) }); |
|
Ext.onReady(function(){ var arr = [1,2,3,4,5]; Ext.each(arr,function(item,index,allItems){ alert(allItems[index]); }) }); |