(EXTjs入门.docVIP

入门 环境要求 浏览器 ExtJs支持所有主要的网络浏览器，从IE6到最新版本的谷歌浏览器，在开发调试工程中，我们推荐您使用： Google Chrome 10+ Apple Safari 5+ Mozilla Firefox 4+ 包含Firebug 网络开发插件 这篇教程假设你使用的是最新版本的谷歌浏览器。如果你没有，花一点时间来安装它,并自己熟悉其开发工具。 服务器 尽管不是必须，我们建议你使用本地网络服务器。由于XHR在本地文件时大多数浏览器有协议限制。我们建议安装： Windows -Apache Linux -Apache Mac OS X 自带的apache Apache安装启动后，通过浏览器访问localhost，你应该看到一个Apache启动成功网页。 Ext JS 4 SDK 下载SDK解压到服务器WEB目录的新建文件夹“ExtJS”下，不清楚服务器的WEB目录请参考服务器的手册。这个路径和操作系统有关。一般来说Apache的WEB目录为： Windows - Apache安装目录\Apache2.2\htdocs Linux - /var/www/ Mac OS X - /Library/WebServer/Documents/ 浏览http://localhost/extjs/index.html看到Ext的欢迎页面就算安装成功了。 应用构架 基本结构 尽管不是强制的,下面列出的所有建议应看作是你的指导方针保证您应用是有效组织、可扩展和可维护的。以下是建议的Ext目录结构为: - appname - app - namespace - Class1.js - Class2.js - ... - extjs - resources - css - images - ... - app.js - index.html appname 应用程序源文件 app 应用程序类文件 extjs ExtJS4 SDK文件 resources CSS、图片等文件 index.html HTM文档入口 app.js 应用程序逻辑文件 不要着急立即完成所有这些目录，现在让我们专注开发Ext应用必要的最少代码。我们将创造一个基本的Hello Word应用：称为“Hello Ext”。在您的网页根目录创造下列目录和文件。 - helloext - app.js - index.html 将包含Extjs SDK的Extjs文件夹放到helloext目录下。 典型的Ext应用包含单一的Html文档--index.html文件： html head titleHello Ext/title link rel=stylesheet type=text/css href=extjs/resources/css/ext-all.css script type=text/javascript src=extjs/ext-debug.js/script script type=text/javascript src=app.js/script /head body/body /html extjs/resources/css/ext-all.css 框架CSS文件 extjs/ext-debug.js 最少的Extjs核心代码 app.js 应用程序逻辑 下面是应用程序逻辑：---app.js Ext.application({ name: HelloExt, launch: function() { Ext.create(Ext.container.Viewport, { layout: fit, items: [ { title: Hello Ext, html : Hello! Welcome to Ext JS. } ] }); } }); 打开浏览器浏览http://localhost/helloext/index.html。将看到一个面板标题为Hello Ext，内容为welcome。 动