EXT_JS實用开发指南_个人整理笔记.docxVIP

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