Extjs学习笔记 - 初篇

Extjs学习笔记 - 初篇2010-12-05realsmy无意中接触到的Extjs，还去baidu查了查什么是Extjs，随之，被它酷酷的外表迷惑了，即使很多人在议论着它几百K的胖客户端所带来的性能问题，依旧不会影响我学习它的心情。

对于Extjs的前景我没资格谈，也不想谈，这个问题离我太远。

Extjs就是一个js库，里面封装了很多常用的UI组件，目前的版本是2.0。

关于学习Extjs

官方网站： http://www.extjs.com/

这里当然是最好的学习Extjs的地方，里面有关于Extjs的Demo和文档。而且，它的论坛的口碑也不错，推荐英语猛的人可以去逛逛。

象我这种英语比较poor的人，学习起来就比较费劲了。

推荐一个中文论坛： http://jstang.5d6d.com

逛了两天，感觉里面的一些资料很不错，还居住着一些象frank这样的牛人。

去官网上下载一个ext2.0的包，这个包里面就是要学的全部内容。

包里的docs和examples两个文件夹就是Extjs的文档和Demo，和网站上看到的是一样的。

examples一般就是学习者的入口了，研究里面的几个例子。

主要应用的几个文件：

ext-all.js，adapterextext-base.js和resources下的全部，这是别人的一个推荐，没什么标准，我感觉先排除一些文件，可以提高学习的效率。

关于学习Extjs的环境

myeclipse + spket插件 + firefox + firebug

对于firefox + firebug前几天提过了，spket插件今天是第一次用，spket也可以作为一个独立的IDE平台。它的功能还不清楚，使用它是因为下载的Ext包里的js文件都是密密麻麻的无格式化的代码。而spket中的ctrl + shift + f 让我有一种熟悉的感觉，这样在eclipse中可以清晰的看到js的结构。

学习内容

当初就是因为一个panel的实现，让我接触到的Extjs，这不是Extjs最引人的地方，却是我学习的方向和入口。

看了大多数的学习笔记，首先要接触的就是 Ext.onReady（function（） {

alert（"hello world！ "）;

}）;

这个是在DOM加载完之后执行的，也就是我们平时所常说的页面加载完毕之后执行的，当然它应该属于页面加载的一部分。

onReady方法里的function可以看作一个匿名类对象。

还有一些常用的语法：

var myDiv = Ext.get（"myDiv"）;
// 返回id为myDiv的Element对象
var ps = Ext.select（"p"）; 
// 返回id为p的Element对象数组,可以使用ps.each（）进行遍历。
Ext.get（"myButton"）.on（"click", yourClickFunction）;
// 给myButton元素添加事件，yourClickFunction 是一个function对象.
// more