我与EXTJS有个约会--初识EXTJS

第二章：初识EXTJS。你的容颜媚悦动人

2.1 你如此美丽，让我无法不心动

         当我第一次看到她的时候，她的美丽便让我怦然心动，我不禁唱起“在千山万水人海相遇，喔，原来你也在这里”。

         快别唱了，还是赶紧去她家看看长的啥样吧。在浏览器上键入http://extjs.com/products/extjs/在官方网站上先预览一下吧。

         官方网站上提供了几乎所有控件的演示实例，每个实例都有非常详尽的JS源码，用户可以根据自己的需要进行学习，改造，并把它们运用到自己的项目中。我认为学习和使用EXTJS最好的方式就是看官方网站上提供的这些例子的源代码，然后再进行改造，结合API，然后就会有一个非常好的效果，这样要比在网上漫无目的的查找和自己闷头看API要强的多。

         初次见面，整体印象非常不错，但这还不够，再仔细看看她哪里有不一样的精彩。

看看这个列表，集编辑、分组、查询、排序为一身，功能强大的让我咂舌。

再看看下面的树，两颗树可以通过拖拽的方式自由添加，超帅。

还有好多的例子，都是非常漂亮的，而且功能非常的强大，我就不一一介绍了，自己可以在官网上慢慢的预览。

 

最后再发一个更酷的例子----用EXTJS模拟windows桌面，为了这也得搞定EXTJS。

 

         不用再看了，太美了，赶紧让她落户本地吧。

         我们把下载下来的EXTJS的文件包放在本地直接运行，不会看到非常好的效果，虽然API部分都是一些HTML文件。我们要想看到她美丽的样子，就得给她一个好的环境。这里我们选用tomcat作为EXTJS的运行环境。把下载下来的EXTJS SDK的文件夹直接拷到tomcat的webapps文件夹下，启动tomcat服务器就可以直接运行了。

看，和官网上是不是一样的效果，这样我们就不用去她的娘家一睹她的容貌了，离线就可以看到她的例子和API，学习起来是不是更加方便了啊。当然网上还有很多人制作的离线的API，让我们更加方便的学习。也感谢这些人无私的奉献。

        

2.2 第一个例子，Hello MM

         看完这么多漂亮的例子，我们是不是也心动了呢，是不是蠢蠢欲动想小试一下牛刀，那就跟着来做个Hello World吧。哦，不，不再做那让人作呕的Hello World了，来个Hello MM吧。

首先，在MyEclipse下建立一个web project。

然后，我们引入需要用到的EXTJS的相关资源。主要有ext-all.js,ext-base.js,ext-all-debug.js, ext-lang-zh_CN.js还有resources整个文件夹（该文件夹存放了ext所有的样式、图片）。

 

         让我们开始动手，亲手实现一个漂亮的例子吧。先来建立一个index.html，然后将工作区切换到Aptana视图，并用Aptana的html的编辑器打开。效果如下：

让我们看看效果吧。是不是比我们直接用alert漂亮多了，其实ext封装了很多漂亮的控件，我们会在以后的章节中一一介绍。

【解惑】：有时候我们的程序不能正常运行，报“Ext未定义”的错误，是什么原因呢？

         最有可能的原因是我们引入js文件时，弄错了js的顺序。一般情况下，我们引入js一般不会发生因js的顺寻而出现的错误，但是这几个基本的js还是有一定的顺序的。至少保证ext-base.js在第一个位置上，因为它是一个全局的适配器，定义了Ext框架的核心组件。其次是ext-all.js，ext-all-debug.js是用于调试用的，在开发阶段为了便于调试可以引入，在发布的时候删除。

 

2.3 Ext的瑕疵

         再美的仙女都不可能是十全十美的，否则上帝造物就太不公平了。美丽的外表不能掩盖性能的缺失，这就俨然美神—维纳斯那残缺的双臂。

         Ext庞大的类库，看起来如此的笨重，光下载js类库也需要消耗很长的时间。同时Ext使用js来生成页面，会产生大量的，无用的，冗余的DOM节点，每一次重新生成DOM节点，需要消耗大量的资源。下图就是简单的拖动提示框而捕捉到的CPU和内存的消耗，一个简单的提示框就能瞬间消耗80%的CPU利用率，可见性能缺失让人惊叹。上帝给你一张迷人的外表，却让你失去了双臂，我们这才感叹世界有时候还是蛮公平的。

但是作为一门新兴的技术，必然有着很多的缺陷，谁生来都不是完美的。但是，我相信，随着越来越多的人使用EXT，Ext必将慢慢的完善起来，在RIA领域扮演着越来越重要的角色，让我们共同努力，共同期待。

 

由于我写这个教程的本意和初衷是在实际的开发中运用Ext，完全从实用的角度出发，以最简单的程序实现我们想要的系统，所以一些给予理论的对EXT的结构，源码等等介绍，我这里便不再赘述了。由于Ext完美的框架设计和面向对象的强大封装，作为Java程序员应该很容易就能上手。以后的章节，我会通过具体的实例来分析和学习Ext，因为自己本身是Java程序员，后台将全部采用java来实现。也希望各位朋友提出你们的宝贵意见，更希望的是你们能参与其中，众人拾柴火焰高嘛。

 

评论

6 楼 d4rkl0rd 2009-06-15  

道德法  

5 楼 yongtree 2008-06-05  

正在构思下一章的内容，请各位朋友提一下意见，采用什么方式、什么结构更好，更希望看到什么样的内容。是介绍框架的组件，还是从实际的开发出发，重点讲述各组件在系统的应用以及和服务器的交互。

4 楼 yongtree 2008-06-05  

收费是有一定条件的。
以下条件不收费：
1、不从事商业用途
2、从事商业用途，但是产品是开源的
3、不修改ext框架做和ext构成竞争的产品

3 楼 siriuslee1982 2008-06-05  

好像收费了

2 楼 spiritfrog 2008-06-04  

感觉lz的文风很惬意
期待续集。

1 楼 maxiaoxia 2008-06-04  

这么辛苦，支持一下