### EXT中文手册知识点总结
#### 1. EXT简介与安装
- **EXT**: 一种用于构建Web应用程序的JavaScript框架,提供了丰富的用户界面组件和强大的工具集。
- **安装**: 安装过程涉及到将ZIP文件解压到指定目录,并确保所有必要的文件(如`ExtStart.html`, `ExtStart.js`, `ExtStart.css`)都正确放置于EXT的安装目录内(例如`C:\code\Ext\v1.0\tutorial`)。通过双击`ExtStart.html`启动页面,若一切正常,页面上会出现一条消息告知配置已完成;反之,则需根据页面提示解决JavaScript错误。
#### 2. Ext.onReady 方法
- **Ext.onReady**: 此方法用于确保DOM完全加载完成后再执行指定的JavaScript代码,确保页面内的所有元素可以被脚本引用。
- **示例代码**:
```javascript
Ext.onReady(function() {
alert("Congratulations! You have Ext configured correctly!");
});
```
- **作用**: 通常用于页面加载完成后初始化某些功能或设置。
#### 3. Element:Ext 的核心
- **Element**: Ext的核心在于能够轻松地获取和操作DOM元素。
- **传统JavaScript方法**: 使用`document.getElementById()`获取DOM节点。
- **Ext方法**:
- 更高效地获取元素并进行操作。
- 示例代码:
```javascript
var myDiv = Ext.get('myDiv');
```
#### 4. 获取多个DOM的节点
- **获取多个元素**: 可以使用Ext提供的方法来同时获取多个DOM节点,而不是逐个调用`getElementById()`。
- **示例代码**:
```javascript
var elements = Ext.query('#myDiv, #myOtherDiv');
```
#### 5. 响应事件
- **事件处理**: Ext简化了事件处理机制,使得开发者可以更加容易地为DOM元素绑定事件监听器。
- **示例代码**:
```javascript
Ext.get('myButton').on('click', function() {
alert('Button clicked!');
});
```
#### 6. 使用Widgets
- **Widgets**: Ext提供了一系列预构建的UI控件,如按钮、网格等,大大提高了开发效率。
- **示例组件**:
- **MessageBox**: 显示对话框或警告信息。
- **Grid**: 创建数据表格。
- **更多组件**: 还有更多的UI组件可用于不同的场景。
#### 7. 使用Ajax
- **Ajax支持**: Ext内置了对Ajax的支持,使得开发者可以轻松地从服务器异步获取数据并更新页面内容。
- **示例语言**:
- **PHP**: 可以使用PHP作为后端语言与Ext交互。
- **更多示例**: 包括JavaScript与不同后端语言的集成。
#### 8. TabPanel基础
- **TabPanel**: 一种用于实现标签页式布局的组件。
- **创建步骤**:
1. **创建HTML骨架**: 构建基本的HTML结构。
2. **构建Ext结构**: 初始化Ext框架。
3. **创建Tab控制逻辑**: 编写用于控制标签页切换的JavaScript代码。
#### 9. 表单组件入门
- **表单组件**: 提供了创建复杂表单的能力,包括验证和提交数据等功能。
- **创建流程**:
1. **创建表单体**: 设计表单的基本结构。
2. **创建表单字段**: 添加输入框、下拉列表等。
3. **完成表单**: 设置表单的行为和样式。
4. **填充或提交数据**: 实现表单数据的读取和提交功能。
#### 10. 继承与类设计
- **继承**: Ext支持面向对象的编程模式,包括类的继承和封装。
- **示例**:
- 使用构造函数创建对象。
- 共享方法的实现。
以上知识点总结了EXT中文手册中的核心内容,覆盖了从安装到具体使用的各个方面,帮助开发者快速掌握EXT框架的基本用法和高级技巧。