EXT初体验

Ext SDK下载，http://dev.sencha.com/deploy/ext-3.2.0.zip EXT已经发展到4.0了，有最新的下载

下载后解压 有resource、adaper、docs 、example等文件夹  4.0好像没有adapter

extjs 需要在页面中引入extjs 的样式及extjs 库文件，样式文件为resources/css/extall.css，extjs 的js 库文件主要包含两个，adapter/ext/ext-base.js 及ext-all.js，其中ext-base.js 表示框架基础库，ext-all.js 是extjs 的核心库 。其中有debug版本，便于查看，主要用于开发阶段。

HelloWorld:

<script>

     Ext.onReady(function(){

           alert("Hello world!");

    });

</script>

如果能成功看到弹出框，则你Ext框架成功搭建，可以开始Ext之旅了。

接触Ext最常用的方法为onReady,表示在页面加载前执行，相当于js中onload事件。

为了解决命名冲突问题，EXT存在命名空间namespace。

Ext.namespace(“myNameSpace”); // 创建命名空间

myNameSpace.app = function(){   // 创建命名空间下的应用程序

       //私有变量

       var  btn1;  var privVar1 = 11;

      //私有函数

      var btnHandler = function(button,event){

        alert("privVarl = " + privVar1);              // 可以访问

        alert("btn1Text = " + this.btn1Text);   //当 未在公共方法init中定义作用域为this时，是无法访问的

      }

     //公共空间

     return {

       btn1Text:"button 1",

       init:function(){

           btn1 = new Ext.Button({       //创建按钮

                  renderTo:Ext.get("btn"),//页面定义的一个Id为btn的div
                   text: this.btn1Text
                 , handler: btn1Handler

                 ,scope:this
            });

       }

    }       

}();

//方法的调用

Ext.onReady(myNameSpace.app.init,myNameSpace.app);