什么是ExtJs

ext是一个强大的js类库,以前是基于YAHOO-UI,现在已经完全独立了,

主要包括data,widget,form,grid,dd,menu,其中最强大的应该算 grid了,编程思想是基于面对对象编程(oop),扩展性相当的好.可以自己写扩展.自己定义命名空间.web应用可能感觉太大.不过您可以根据需要按 需加载您想要的类库就可以了.
主要包括三个大的文件ext-all.css,ext-base.js,ext-all.js(包括所有的类库,您可以根据需要进行删减.官方网站提供这一接口),在引用ext类库的时候.这三个文件必不可少.
它提供了丰富的，非常漂亮的外观体验，成为众多界面层开发人员的追捧！其核心的组件基本覆盖了我们构建富客户端的常用的组件。
从 Ext 2开始，商业版(针对那些以盈利为目的的开发方)要收费了。这可能会影响一些他的应用前景。
目前的最新版本为3.0RC，该版本是在2009年4月15日发布的。

Ext发展史

1、第一只“出海”的YUI-Ext只是作者Jack打算对基于BSD协议的Yahoo!UI库进行自定义的扩展，但后来一度风头盖过其父辈YUI， 足以说明 大家对它的热情，很多人把它投入项目人并不十分了解它。分析人士打了一比喻：就好比尚未谋面， 并不了解一个人的家庭、教育、品行等背景，只因为他有一副精致漂亮的外观，就对其陷入了疯狂的倾慕之中。因此分析人士建议，在投入项目前，要认真仔细地了 解EXT的内在原理和与其他Ajax库不同地方。

2、在2006年初 ，Jack Slocum(杰克斯·洛克姆 ) 就一套公用设施扩建为Yahoo! User Interface (YUI) 库而工作。这些扩展很快组织成一个独立的库代码并以” yui-ext” 的名义下发布。
3、在2006年秋天,Jack发行了版本为0.33的yui-ext,而最终被证明为最后版本的代码，根据这名字（下开放源代码DSB许可）。在年底之前，这个库已大受欢迎, 名字被简化为Ext，反映了它作为一个框架的成熟和独立。
该公司成立于2007年初，Ext现在为双执照，使用LGPL和一个商业执照。
4、在2007年4月1日，发布1.0正式版。
5、直至今日(2008年4月1日)ExtJS已发展涵盖美国、日本、中国、法国、德国等全球范围的用户，现在的版本为Ext-3.0
6、官方在2009年4月14-16日的首次Ext Conference中发布了Ext的3.0 RC版本。

ExtJs UI Engine简介

ExtJs初期仅是对Yahoo! UI的对话框扩展，后来逐渐有了自己的特色，深受网友的喜爱。 发展至今， Ext除YUI外还支持Jquery、Prototype等的多种JS底层库，让大家自由地选择。该框架完全基于纯Html/CSS+JS技术，提供丰富 的跨浏览器UI组件，灵活采用JSON/XML数据源开发，使得服务端表示层的负荷真正减轻，从而达到客户端的MVC应用！

ExtJs支持多平台下的主流浏览器 Internet Explorer 6+ FireFox 1.5+ (PC, Mac) Safari2+、Opera9+。在使用的厂家包括IBM、Adobe、Cisco和更多。ExtJs官方网站www.extjs.com

Ext学习及应用经验小结

一、理解Html DOM、Ext Element及Component

要学习及应用好Ext框架，需要理解Html DOM、Ext Element及Component三者的区别。
Ext是基于Web的富客户端框架，其完全是基于标准W3C技术构建设的，使用到的都是HTML、CSS、DIV等相关技术。Ext最杰出之处，是开发了一系列非常简单易用的控件及组件，我们只需要使用这些组件就能实现各种丰富多彩的UI的开发。
无论组件有多少配置属性、还是事件、方法等等，其最终都会转化为HTML在浏览器上显示出来，而每一个HTML页面都有一个层次分明的DOM树模型，浏览器中的所有内容都有相应的DOM对象，动态改变页面的内容，正是通过使用脚本语言来操作DOM对象实现。
仅仅有DOM是不够的，比如要把页面中的某一个节点移到其它位置，要给某一个节点添加阴影效 果，要隐藏或显示某一个节点等，我们都需要通过几句 javascript才能完成。因此，Ext在DOM的基础上，创建了Ext Element，可以使用Element来包装任何DOM，Element对象中添加了一系列快捷、简便的实用方法。
对于终端用户来说，仅仅有Element是不够的，比如用户要显示一个表格、要显示一棵树、要 显示一个弹出窗口等。因此，除了Element以外，Ext 还建立了一系列的客户端界面组件Component，我们在编程时，只要使用这些组件Componet即可实现相关数据展示及交互等，而 Component是较高层次的抽象，每一个组件在渲染render的时候，都会依次通过Element、DOM来生成最终的页面效果。
在使用Ext开发的应用程序中，组件Component是最高层次的抽象，是直接给用户使用 的，Ext Element是Ext的底层API，主要是由Ext或自定义组件调用的，而DOM是W3C标准定义的原始API，Ext的Element通过操作DOM 来实现页面的效果显示。
在Ext中，组件渲染以后可以通过访问组件的el属性来得到组件对应的Element，通过访 问Element的dom属性可以得到其下面的DOM对象。另外，我们可以通过通过Ext类的快捷方法getCmp、get、getDom等方法来得组件 Component、Ext元素Element及DOM节点。比如：
var view=new Ext.Viewport();//创建了一个组件Component
view.el.setOpacity(.5);//调用Element的setOpacity方法
view.el.dom.innerHTML="Hello Ext";//通过Element的dom属性操作DOM对象
再看下面的代码：
var win=new Ext.Window({id:"win1",title:"我的窗口",width:200,height:200});
win.show();
var c=Ext.getCmp("win1");//得到组件win
var e=Ext.get("win1");//根据id得到组件win相应的Element
var dom=Ext.getDom("win1");//得到id为win1的DOM节点
二、熟悉ext组件体系
Ext2.0对整个框架进行了重构，最为杰出的是推出了一个以Component类为基础的组件体系，在Component类基础上，使用面向对象的方法，设计了一系列的组件及控件。因此，要能游刃有余地使用Ext，熟悉Ext组件体系是最基本的。
在《ExtJS实用开发指南》中，有如下面一幅组件图：
通过组件结构图我们可以一目了然的看出整个Ext组件继承及组成体系，当使用一个组件的时间，了解他的继承体系，这样可以便于我们掌握组件的各种特性。
三、掌握核心控件　
控件其实也是组件，比如用于显示树信息的TreePanel、用于显示表格的 GridPanel及EditorGridPanel，还有代表应用程序窗口的Ext.Window等都属于Ext控件。在使用Ext的时候，一定要掌握 一些核心控件，特别是处于基类的控件。比如上面提到的几个控件，他们都是继承于面板Panel，所以我们要重点掌握面板这个核心控件的特性。比如面板由以 下几个部分组成：一个顶部工具栏(tbar)、一个底部工具栏(bbar)、面板头部(header)、面板尾部(bottom)、面板主区域 (body)几个部分组成。面板类中还内置了面板展开、关闭等功能，并提供一系列可重用的工具按钮使得我们可以轻松实现自定义的行为，面板可以放入其它任 何容器中，面板本身是一个容器，他里面又可以包含各种其它组件。只要掌握了Panel的应用，那么学习TreePanel、Window等就会变得简单得 多。
同样的道理，对于Ext的表单字段来说，不管是ComboBox，NumberField、还 是DateField，他们其它都是 Ext.form.Field类的子类，在他上面定义了表单字段的各种基本操作及特性。在学习使用表单字段组件时，一定要重点研究Field这个类，掌握 他的主要方法、事件等，就能有助于更好的学习使用其它的字段。
四、学习及研究示例
由于javascript语言非常灵活，不像静态强类型语言（比如Java）那样有固定的代码设计模式，而往往是不同的人就有不同的编程风格。在实际应用开发中，只有见多识广，才能在自己的在脑中建立一个开发库。
学习别人的示例对于我们开发帮助会非常大，示例包括基本组件的应用、综合应用等多个方面。在此，简单推荐几个。
１、Ext官方示例，在ext项目下载包的examples目录中，包括各个控件的基本应用演示，同时还有一些比较复杂的组合示例，有简有繁，非常适合初学者认真研究。
２、Vifir推出的示例，Vifir推出的一些示例主要包括两类，一种是开源的示例应用，另 外一种是针对VIP用户的实用示例。开源的示例主要是指 wlr单用户blog系统，这个一个集合了前后台技术的ext综合示例，而针对VIP用户的实用示例则是可以作为开发骨架或扩展组件的示例。
３、其它示例，在ext社区中还有很多比较优秀的ext应用示例，有些只是一个应用演示，虽然没有提供源码下载，但我们可以直接下载引用的js文件来得到这些示例的ext应用代码，同样能取起到非常好的学习效果。
五、多运用
Ext看起来是非常简单的东西，稍有点编程知识的人，按照《ExtJS实用开发指南》中的入门 指南，半小时就能学会使用Ext。然而，当准备使用Ext开发一个项目时，却不知道从何处入手，或者是在使用Ext的时候，出了一点小问题自己不知道该如 何解决。编程是一门实践性的科学，仅仅靠看书、看别人写的代码是远远不够的，因此，必须多做实践才行，只有通过不断的练习，大量的使用，才能对Ext的组 件特性、事件、事件处理机制以及与服务器端交互接口等深入的掌握，只有多做运用，深入了解ext的组件的工作原理及机制，才能编写出高级的Ext的应用。
六、熟读Ext项目的源代码
如果要想深入应用Ext，那么阅读Ext项目的源代码这是必不可少的环节，Ext的代码质量非 常高，通过阅读他的代码我们可以更加深刻的了解 javascript面向对象编程，Ext代码中包含了很多高级的js技巧以及设计模式。在使用Ext的过程中，我们经常根据项目的需要对Ext组件进行 扩展，设计自己的组件或控件，而如何实现一个自定义的Ext组件，我们可以从Ext的各个组件源代码中找到答案。
Ext的源代码在Ext项目的source目录。读Ext源码，并不一定非要从某一个地方开 始，而组件核心代码Component.js、容器组件代码 Container.js、面板Panel.js等这些是必看的； core目录中的Element.js、Ext.js等也是必看的。当需要从一个控件进行扩展的时候，最好能简单看一看这个控件的源代码。