EXT_JS实用开发指南..doc

EXTJS 实用开发指南 1、要使用 ExtJS 框架的页面中一般包括下面几句: <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-" /> <script type="text/javascript" src="extjs/adapter/ext/ext-"></script> <script type="text/javascript" src="extjs/ext-"></script> = '../../js/ext2/resources/images/default/tree/'; 在 ExtJS 库文件及页面内容加载完后, ExtJS 会执行 中指定的函数,因此可以用, 一般情况下每一个用户的 ExtJS 应用都是从 开始的, 使用 ExtJS 应用,程序的代码大致如下: <script> function fn() { alert( “ ExtJS 库已加”); } (fn); </script> 2、 A: fn 也可以写成一个匿名函数的形式,因此上面的代码可以改成下面的形式: <script> (function () { alert( “ ExtJS 库已加载!”); } ); </script> B: 进一步,我们可以在页面上显示一个窗口,代码如下: <script> (function() { Var win=new ({title:"hello",width:300,height:200,html:'<h1>Hello,easyjf open source</h1>'});// 参数是" 标题, 宽度, 高度,html 文本" (); }); </script> 3、 ExtJS 的类库由以下几部分组成: 底层 API(core) :底层 API 中提供了对 DOM 操作、查询的封装、事件处理、 DOM 查询器等基础的功能。其它控件都是建立在这些底层 api 的基础上,底层 api 位于源代码目录的 core 子目录中,包括 、 等文件控件(widgets) :控件是指可以直接在页面中创建的可视化组件,比如面板、选项板、表格、树、窗口、菜单、工具栏、按钮等等, 在我们的应用程序中可以直接通过应用这些控件来实现友好、交互性强的应用程序的 UI 。控件位于源代码目录的 widgets 子目录中实用工具 Utils : Ext 提供了很多的实用工具, 可以方便我们实现如数据内容格式化、 JSON 数据解码或反解码、对 Date 、 Array 、发送 Ajax 请求、 Cookie 管理、 CSS 管理等扩展等功能4、 对框架进行了非常大的重构, 其中最重要的就是形成了一个结构及层次分明的组件体系, 由这些组件形成了 Ext 的控件, Ext ponent 类定义, 每一种组件都有一个指定的 xtype 属性值, 通过该值可以得到一个组件的类型或者是定义一个指定类型的组件。组件体系由下图所示: 组件大致可以分成三大类,即基本组件、工具栏组件、表单及元素组件。基本组件有: xtype Class box 具有边框属性的组件 Button 按钮 colorpalette ponent ponent 组件 container 容器 cycle dataview 数据显示视图 datepicker 日期选择面板 editor 编辑器 rid 可编辑的表格 grid 表格 paging 工具栏中的间隔 panel 面板 progress 进度条 splitbutton 可分裂的按钮 tabpanel 选项面板 treepanel 树 viewport 视图 window 窗口工具栏组件有 toolbar