ExtJS4学习教程：环境搭建与HelloWorld

"Extjs4.0权威指南(中文)，网络整理的学习资料，主要介绍如何获取和使用Extjs4.0，包括搭建学习环境、查看API文档和示例、创建基本的 HelloWorld 示例，以及介绍Ext.onReady和Ext.application方法的基本用法。" 在深入探讨ExtJS4.0之前，首先理解这是一个流行的JavaScript框架，用于构建富客户端Web应用程序。ExtJS提供了丰富的组件库，包括表格、面板、窗口、菜单等，以及强大的数据绑定和布局管理功能。本文档，即《Extjs4.0权威指南》，旨在弥补Extjs4学习资料的不足，为初学者提供指导。 获取ExtJS4.0： 你可以通过官方站点http://extjs.org.cn/下载所需的发布包，这个版本是4.0.7。下载后，需要将解压的文件复制到MyEclipse中的Web项目Webroot目录下。 搭建学习环境： 确保你的机器上已经安装了MyEclipse和Tomcat服务器。如果没有，你需要先安装这些开发工具。在MyEclipse中创建一个新的Web项目，命名为“Extjs4”，然后将下载的ExtJS4.0.7文件复制到该项目的Webroot目录。Examples目录包含各种示例程序，可能会有PHP代码，如果遇到错误提示，可暂时忽略。 环境验证： 部署并启动Tomcat服务器，访问http://localhost:8080/Ext4/index.html来测试环境是否配置正确。如果看到预期的界面，说明环境已准备就绪。同时，你可以通过http://localhost:8080/Ext4/docs/index.html 查看API文档，以及http://localhost:8080/Ext4/examples/index.html 浏览示例页面。 编写HelloWorld： 在Webroot目录下创建helloworld.js文件，写入基本的代码，然后创建helloworld.html文件，引入必要的CSS和JS文件。确保引用路径正确无误。在浏览器中访问http://localhost:8080/Ext4/helloworld.html，如果看到一个标题为"HelloExt"，内容为"Hello! Welcome to ExtJS."的面板，说明代码运行成功。 关键方法： 在ExtJS中，Ext.onReady和Ext.application是非常重要的方法。Ext.onReady会在DOM完全加载后执行，确保所有元素都可被脚本访问。而Ext.application是应用的入口点，用于配置和启动整个应用程序。这两个方法通常是学习ExtJS时接触的第一个知识点。 在学习过程中，你可以尝试在Ext.onReady函数中添加代码，观察页面加载后的效果。这有助于理解ExtJS的事件驱动模型和页面生命周期。 通过这个指南，学习者可以逐步掌握ExtJS4.0的基础知识，包括环境配置、组件使用、API查阅以及基本的编程技巧。随着深入学习，可以进一步探索ExtJS的高级特性，如数据存储、远程通信、图表绘制等，从而构建复杂的Web应用程序。