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');