ExtJS常用函数与事件详解

"这篇文档主要介绍了ExtJS框架中的一些常用函数和事件，这些函数和事件在开发基于ExtJS的应用程序时非常关键。" 在ExtJS框架中，掌握一系列核心的函数和事件对于创建用户界面至关重要。以下是部分重要的Ext类和其相关函数的详细说明： 1. `Ext.onReady(Function fn, Object scope, boolean override)`: 这个函数用于在DOM准备就绪后执行指定的函数。它是ExtJS应用的入口点，通常在这里初始化组件和设置页面结构。 2. `Ext.get(Mixed el)`: 此函数用于获取一个DOM元素，可以接受ID、DOM节点或者选择器作为参数，返回一个Ext.Element对象，方便进行DOM操作。 3. `Ext.select(String/Array selector, [Boolean unique], [HTMLElement/String root])`: 根据CSS选择器选取一组DOM元素，如果`unique`为真，返回的将是单个元素。`root`参数可指定选择器的根节点。 4. `Ext.query(String path, [Noderoot])`: 类似于jQuery的`$()`，用于选取DOM元素，返回一个NodeList。此函数基于Sizzle选择器引擎，支持复杂的选择器表达式。 5. `Ext.getCmp(string id)`: 通过元件的ID获取对应的Ext.Component对象。这是在ExtJS中查找组件的常用方法。 6. `Ext.getDom(Mixed el)`: 获取一个DOM元素，返回原生JavaScript的DOM对象。与`Ext.get`类似，但返回的是原生对象而非封装后的Ext.Element。 7. `Ext.isEmpty(Mixed value, [Boolean allowBlank])`: 判断值是否为空或等于空字符串。如果`allowBlank`为真，空格也会被视为非空。 8. `Ext.namespace(string namespace1, string namespace2, string etc)`: 创建命名空间，方便组织代码，避免全局变量污染。 9. `Ext.each(Array/NodeList/Mixed array, Function fn, object scope)`: 遍历数组或NodeList，并对每个元素执行指定的函数。`scope`参数用于设置回调函数的作用域。 10. `Ext.apply(Object obj, Object config, Object defaults)`: 将`config`对象的所有属性复制到`obj`对象上，如果`defaults`存在，会先复制`defaults`的属性。 接下来是Ext.DomHelper的相关方法，这个类提供了创建和操作DOM元素的功能： 11. `Ext.DomHelper.append(Mixed el, Object/String o, [Boolean returnElement])`: 在指定的元素（`el`）后面添加新的DOM元素。如果`returnElement`为真，将返回新创建的Ext.Element。 12. `Ext.DomHelper.applyStyles(string/HTMLElement el, String/Object/Function styles)`: 应用CSS样式到指定元素。`styles`可以是字符串，对象，甚至是一个返回样式的函数。 13. `Ext.DomHelper.createTemplate(Object o)`: 创建一个模板，用于动态生成HTML元素。 14-17. `Ext.DomHelper.insertAfter`, `insertBefore`, `insertFirst` 和 `insertHtml` 分别用于在指定元素之后、之前、内部开头和特定位置插入HTML内容，支持返回新创建的元素。 18. `Ext.DomHelper.overwrite(Mixed el, obj)`: 用新内容覆盖已存在的DOM元素。 以上函数和事件是ExtJS开发中的基础工具，熟练运用它们能帮助开发者高效地构建富客户端应用。理解并掌握这些函数的用法是成为ExtJS开发者的必备条件。在实际开发中，结合ExtJS的组件模型和事件系统，可以构建出功能强大、交互丰富的Web应用程序。