Extjs教程第一章起步.docx

起步 在这章里，我们将介绍ExtJS的基本功能。如果你对web开发熟悉的话，您会惊诧于ExtJS框架的优雅！不同其他的JavaScript库，ExtJS为您的开发夯实了基础，只需几行代码，你就可以制作出丰富的用户界面。 本章包括： 1. ExtJS的功能和您将会喜爱上它的原因； 2. 如何获得Ext并在web应用中采用它； 3. 采用”适配器(adapters)“使得Ext和其他的JavaScript库共存； 4. 充分利用AJAX技术； 5. 在您的语言中展示ExtJS对象； 关于Ext： 我们采用必威体育精装版的的Ext 2.x版本，1.x版本到2.x版本的是一个重组的过程，包括添加新的组件、重命名组件用来重新组织结构等等。这使得1.x和2.x兼容性很低。3.x版 本则不然，他对2.x有很强的兼容性，可以很好的联合本书中所设计的内容。Ext的开发组决定在日后的版本发布中都做到向前兼容。 Ext库是对雅虎YUI的一个拓展，提供了它所不支持的特性：良好的API，真实的控件。虽然YUI致力于用户界面，但是它却没有提供许多有用的功能。 Ext的产生源自于开发者、开源贡献者们将YUI扩展成一个强大的客户端应用程序库的努力。 Ext提供了一个简单丰富的用户界面，如同桌面程序一般。这使得开发者能够把精力更多的转移到实现应用的功能上。Ext官网上的示例会让你知道它是如何的不可思议：/deploy/dev/examples/。 其中最引人注目的一个例子就是Feed Viewer，它展示了Ext.However提供的多种特性，对于学习来说它可能太复杂了，所以现在只需你感受它带给你的精彩。 另外一个精彩的例子就是Simple Task任务跟踪程序，它加载了Google Gears的数据库。 Ext: 不仅仅是另一个JS库： Ext不仅仅是另一个JS库，实际上它可以通过适配器（adapter）和其它JS库一起工作。我们将在本章的稍后来介绍适配器。 通常来说，我们使用Ext的目的是满足高层次的用户交互——要比我们传统概念上的站点交互性更强。一个采用了工作流和任务管理的网站就是一个很好的示例，否则Ext只能带给您的上司惊奇的喘息。 Ext让通过如下的方式来让web应用的开发变的十分简单： 提供简单的，跨浏览器的控件，如：窗口、表格、表单。这些组件都是能够适应市场上的主流浏览器的。我们不需要做任何改动。 用户是通过EventManager来和浏览器做交互的，相应的事件有：用户的键盘输入，鼠标击打，浏览器监听（窗口改变大小，改变字体）等等； 在和用户交互时不需要刷新页面，一切在后台进行。它允许你从服务器通过AJAX来获取或者提交数据并且在第一时间执行你的反馈。 跨浏览器DOM： 我确定不需要在解释浏览器兼容带来的问题了。一个有着自定义样式的div在不同的浏览器的显示是不同的。但当我们使用Ext的控件时，Ext库会很好地控制这种浏览器的兼容性，所以在不同浏览器中控件的显示是几乎相同的。这些浏览器包括： Internet Explorer 6+ Firefox 1.5+ (PC, Mac) Safari 2+ Opera 9+ (PC, Mac) 事件驱动接口： 事件是用来描述某种动作的发生。一个事件可以是用户的动作，例如单击某个元素或者对AJAX请求的相应。当用户对一个按钮进行操作的时候，会产生很多而不是一个事件，包括：鼠标指向按钮，点击按钮和离开按钮。我们可以添加监听器（listener）来监听这些事件，并调用相应代码采取相应。 对事件的监听并不完全依靠用户界面，系统事件随时随刻发生，当你发起AJAX请求，和AJAX状态相关的事件也就产生了，它们是：开始，完成和失败等等。 Ext和AJAX: AJAX用来描述同服务器的异步交互，你可以在同服务器交互的同时来进行其他的任务。一个用户可以在加载一个表格数据的同时填写自己的表单——它们并行不悖，不用等待页面的刷新。 获得Ext： 所有你所需的东西都可以从Ext官网上获得： HYPERLINK /download /download。下载包含大量示例和API的Ext SDK， 它最重要的功能是带给你使Ext正确运行的资源。 如何安置Ext： 当你获得SDK文件，把它解压到你的硬盘上，最好放在你自己的文件夹中。我访问文件的方式是按照linux规则来的，为了很好地运行本书示例，我把所有文件解压到命名为lib的文件夹中。 当一切处理好后，你的目录结构应该如下所示： 为了使Ext容易升级到必威体育精装版版本，我把解压后的文件夹ext-2.0.1重新命名为extjs。 SDK里有一个包含所以Ext的JS代码的文件，名字为ext-all。它还有一个可供调试代码的副本，由于进行了代码的格式化和反混淆等操作，该文件可以您准确定位到错误的行数和具体