Extjs 选择元素涉及方法总结

本文主要是解释Extjs在使用过程中使用的相关选择方法：

1.首先解释第一组概念：

Ext.get（String/HTMLElement/Ext.Element el）

Ext.getCmp（String id）

Ext.getDom（String/HTMLElement/Ext.Element el）

在理解之前，建议先看两篇基础知识的文档：

  1.[转载]Extjs中的dom,Ext.Element和Ext.Component对象的关系

  2.【转载】Extjs 中id与itemId的区别

理解了基础概念之后，我们来看：

• Ext.get（String/HTMLElement/Ext.Element el） ：
• 入参：节点的id，一个DOM节点或现有元素。
• 作用：检索Ext.dom.Element对象
• 出参：返回Ext.dom.Element对象
• Ext.getCmp（String id）
• 入参：组件ID
• 作用：Ext.ComponentManager.get方法的简写。 通过id查找现有的Component。
• 出参：Ext中的Component对象
• Ext.getDom（String/HTMLElement/Ext.Element el）
• 入参：节点的id，一个DOM节点或现有元素。
• 作用：返回dom对象
• 出参：HTML的Dom对象

从上面可以看出，使用最广泛的应该是：Ext.getCmp（id）：但是由于不是每个元素都有Id，所以又有了以下几个方法：

2.第二组概念：

Ext.select（String selector）：返回Ext.CompositeElement

Ext.query（String path, [HTMLElement root], [String type]）：返回HTMLdom数组

相似点是都是根据CSS选择符来查询

不同点：返回的对象不同

截图参考：

3.第三组概念：

如何通过更加通用的方式来获取Ext组件呢？

有了以下三个查询方法：

• Ext.ComponentQuery.query
• 入参: css 选择器
• 作用： 通过css选择器来获取组件数组，
• 出参：Ext中的Component数组

• Ext.ComponentManager.get（String id)
• 入参：组件ID
• 作用： 通过id查找现有的Component。简写方式为：Ext.getCmp(id)
• 出参：Ext中的Component对象
• Ext.container.Container.getComponent（comp）
• 入参：itemId 或者是容器的 id.或者组件所在的位置
• 作用： 查看容器的items 属性并且直接返回这个容器.
• 出参：Ext中的Component对象

 

  另外：

Ext.app.Controller.control中使用的是Ext.ComponentQuery，也就是通过css选择符来选择对应的对象。