Sencha touch中DOM的訪問與控制

Sencha touch中DOM的訪問與控制

在jquery庫中，提供強大對DOM的訪問和控制。同樣，ST2也實現同樣功能，以下介紹幾個比較常用的方法：

 

1.Ext.get()

 

方法的參數是字符串型或數字型關鍵字（key）和索引（index），關鍵字是優先索引，通過key/index獲取組件進行控制和操作。

此Ext.get()方法並不返回組件，而是返回封裝了組件所生成元素的Ext.dom.Element對象，如果沒有找到組件，就返回undefined，如果找的是一個類（Class），則返回null。

 

2.Ext.ComponentManager.get()

 

相比Ext.get()方法，返回則是組件本身，參數是字符串型的組件id。此方法命名會比較長，但是ST2中有相應縮寫的寫法：Ext.getCmp()

 

3.Ext.fly()

 

     使用Ext.fly()方法的元素節點開闢一塊內存，下一次使用Ext.fly方法的元素節點將佔據相同地址的內存。因爲這些元素節點在瀏覽器中共享一塊內存，所以可以提高一部分應用程序使用時的性能。

     此方法參數是元素節點或id，返回則是元素節點對象。

 

4.Ext.ComponentQuery.query()

 

     此方法比較強大的DOM訪問，它不僅提供Ext.ComponentManager一樣方法，而且有CSS選擇器同樣功能。看看它使用情況：

 

// 查找xtype='panel'的組件;

 Ext.ComponentQuery.query('panel');

// 查找一個容器id=’myCt’裏面Ext.Panels組件

 Ext.ComponentQuery.query('#myCt panel');

// 查找一個容器id=’myCt’裏面子組件Ext.Panels

 Ext.ComponentQuery.query('#myCt > panel');

// 全局組件gridpanel, treepanel

 Ext.ComponentQuery.query('gridpanel, treepanel');