ext入门学习
Ext入门学习系列（一）环境配置
Ext⼊门学习系列（⼀）环境配置⼀、EXT是什么？1. Ext是⼀个Ajax框架，可以⽤来开发带有华丽外观的富客户端应⽤，使得我们的b/s应⽤更加具有活⼒及⽣命⼒，提⾼⽤户体验；2. Ext是⼀个⽤javascript编写，与后台技术⽆关的前端ajax框架。
因此，可以把Ext⽤在.Net、Java、Php等各种开发语⾔开发的应⽤中；3. Ext是⾯向对象的；4. Ext没有你想象中的那么难；⼆、Ext从哪⾥获取？解压后有50M⼤⼩，⾥⾯包含了很多其他的⽂档。
三、Ext环境怎么搭建？我们只需要从⾥⾯找出⾃⼰需要的⽂件即可。
按照顺序在根⽬录下找到ext-all.js（最主要的Ext代码库⽂件），然后在adapter/ext/⽬录下找到ext-base.js（EXT的适配器），接下来就需要找语⾔⽂件了名字叫“ext-lang-zh_CN.js”，最后需要把整个样式表⽂件夹找到，在resources ⽂件夹中。
把所有找到的⽂件全部复制到我们需要的⽂件夹下，暂定为Ext⽂件夹，则该⽂件夹下⾯的⽬录结构应该如：我们的站点⽂件放在上级⽬录，如：到此为⽌，环境配置基本完毕。
四、Ext代码怎么写？接下来我们⼀起来写⼀个测试例⼦，因为是JS库，所以⽹页中要做的第⼀件事情就是添加引⽤，在需要⽤到Ext的页⾯源⽂件头部加上：<link rel="stylesheet" type="text/css" href="Ext/resources/css/ext-all.css" /> //引⼊样式<script type="text/javascript" src="Ext/ext-base.js"></script>//引⼊适配器<script type="text/javascript" src="Ext/ext-all.js"></script>//引⼊主⽂件<script type="text/javascript" src="Ext/ext-lang-zh_CN.js" charset="utf-8"></script>//语⾔包接下来才可以正式写，先来⼀个测试：<script type="text/javascript">function start(){Ext.MessageBox.alert("测试","看我漂亮不!");}Ext.onReady(start);//所有的程序都是从这⾥开始执⾏，⾥⾯写函数名</script>如果在VS2010中上⾯的代码是可以直接点出来的，所有代码以Ext开始，如果想弹个对话框，就选Message即可。
ext教程
EXTJS实用开发指南1、要使用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"></script><script type="text/javascript" src="extjs/ext-all.js"></script>Ext.BLANK_IMAGE_URL = '../../js/ext2/resources/images/default/tree/s.gif';在ExtJS 库文件及页面内容加载完后，ExtJS 会执行Ext.onReady 中指定的函数，因此可以用，一般情况下每一个用户的ExtJS 应用都是从Ext.onReady 开始的，使用ExtJS 应用，程序的代码大致如下：<script>function fn(){alert(“ExtJS库已加”);}Ext.onReady(fn);</script>2、A：fn 也可以写成一个匿名函数的形式，因此上面的代码可以改成下面的形式：<script>Ext.onReady(function (){alert(“ExtJS库已加载!”);});</script>B：进一步，我们可以在页面上显示一个窗口，代码如下：<script>Ext.onReady(function(){Varwin=new Ext.Window({title:"hello",width:300,height:200,html:'<h1>Hello,easyjfopen source</h1>'});//参数是"标题,宽度,高度,html文本"win.show();});</script>3、ExtJS 的类库由以下几部分组成：底层API(core)：底层API 中提供了对DOM 操作、查询的封装、事件处理、DOM 查询器等基础的功能。
ExtJS培训进阶教程
ExtJS培训进阶教程软件确实是服务名目1什么是ExtJs (3)2ExtJs的使用 (3)2.1猎取ExtJs (3)2.2应用Extjs (3)2.3演示HelloWorld (4)3get,getDOM,getCmp (4)3.1getDom方法 (4)3.2get方法 (5)3.3getCmp方法 (5)4事件 (8)5ExtJs所包含组件 (9)5.1ExtJS组件分类 (9)6ExtJs常用组件介绍 (11)6.1Panel组件 (11)6.1.1panel例如 (11)6.1.2panel的布局 (12)6.1.3panel属性简介 (14)6.2ViewPort组件 (15)6.3表格控件及其内部属性 (17)6.3.1简单的Grid (17)6.3.2Grid的功能详解 (19)6.4按钮 (27)7Ext.Ajax.request (28)8Ext同步/异步要求 (29)1什么是ExtJsExtJs是能够用来开发带有华丽外观的富客户端应用，使得我们的b/s应用更加具有活力及生命力，提高用户体验。
ExtJs是一个用javascript编写，与后台技术无关的前端ajax框架。
因此，能够把ExtJs用在.Net、Java、Php等各种开发语言开发的应用中。
2ExtJs的使用2.1猎取ExtJs猎取ExtJs://extjs .cn/download公司使用ExtJs版本为2.02.2应用Extjs应用extjs需要在页面中引入extjs的样式及extjs库文件，样式文件为resources/css/ext-all.css，extjs的js库文件要紧包含两个，adapter/ext/ext-base.js 及ext-all.js(ext/build/locale/ext-lang-zh_CN.js)，其中ext-base.js表示框架基础库，ext-all.js是extjs的核心库。
ext教程
ext教程EXT（JavaScript Extensions）是一种用于制作浏览器扩展的标准，它允许开发者以交互式方式修改和自定义Web页面的行为和外观。
在本教程中，我们将介绍如何使用EXT来开发浏览器扩展。
我们将涵盖EXT的基本概念、开发环境的设置、常用API的使用以及实例应用的创建。
首先，我们需要了解EXT的基本概念。
EXT是基于JavaScript 和HTML的，它允许我们通过注入代码来修改Web页面的行为。
我们可以使用EXT来添加自定义按钮、修改页面样式、拦截网络请求等。
为了开始开发EXT扩展，我们需要设置开发环境。
首先，我们需要安装一个支持EXT的浏览器，如Google Chrome或Mozilla Firefox。
然后，我们需要安装开发者工具，如Chrome开发者工具或Firefox开发者工具。
接下来，我们将介绍EXT的常用API。
EXT提供了一组API，用于访问和修改Web页面的各个部分。
例如，我们可以使用API来找到页面上的特定元素，修改其样式或内容。
我们还可以使用API来发送网络请求或拦截已有的请求。
最后，我们将创建一个实例应用来演示EXT的使用。
我们将开发一个简单的扩展，用于在Facebook页面上添加一个自定义按钮。
当用户点击按钮时，它会向后台服务器发送一个请求，并显示返回的数据。
在这个实例应用中，我们将演示如何创建一个扩展程序，并在Manifest文件中指定其基本属性。
我们还将展示如何使用Content Script来注入我们的代码到页面中，并使用Popup来创建一个显示在浏览器窗口中的弹出窗口。
通过这个教程，您将学习到EXT的基本概念、开发环境的设置、常用API的使用以及实例应用的创建。
您将了解如何使用EXT来修改和自定义Web页面的行为和外观。
这将对您开发具有定制功能的浏览器扩展非常有帮助。
总结来说，EXT是一种用于制作浏览器扩展的标准，它允许开发者以交互式方式修改和自定义Web页面的行为和外观。
ext开发手册
ext开发手册一、简介EXT是一个针对构建富应用程序的JavaScript框架，它拥有丰富的组件库和强大的功能。
本手册将为开发人员提供完整的EXT开发指南，包括基础知识、常用组件和开发技巧等内容。
二、基础知识1. 安装和配置EXT：首先，下载EXT框架的压缩包并解压到项目的根目录。
然后，在HTML页面中引入EXT的必要文件，包括CSS和JavaScript。
最后，在需要使用EXT的页面中初始化EXT环境。
2. EXT的核心概念：理解EXT的基本概念对于开发者来说至关重要。
常见的核心概念包括组件、容器、布局和事件等。
组件是EXT的基本构建块，它可以是按钮、表单、树等等。
容器负责管理和布局组件，而布局则定义了组件的排列方式。
事件是EXT中的重要特性，可以用于处理用户交互和系统响应。
三、常用组件1. 表单组件：EXT提供了各种强大的表单组件，如文本框、下拉列表、复选框等。
开发人员可以根据需求选择合适的组件，并根据组件的配置进行自定义设置。
例如，可以通过设置验证规则和错误提示来有效地验证用户输入。
2. 树组件：EXT的树组件是管理层次数据的理想选择。
开发人员可以通过构建树节点和设置节点属性来构建一个功能齐全的树结构。
树组件还支持展开、折叠、选择和拖放等交互操作，使得数据的展示与操作更加灵活。
3. 网格组件：EXT的网格组件是处理大量数据的最佳工具。
通过设置网格的列模型和数据模型，可以实现自定义的数据显示和排序。
网格组件还支持分页、过滤和编辑功能，为用户提供便利的数据处理方式。
四、开发技巧1. 使用样式：EXT提供了丰富的CSS样式，可以为组件添加不同的外观和交互效果。
开发人员可以通过应用样式类名称或自定义样式来实现个性化的外观效果。
同时，也可以使用主题文件来快速地改变整个应用程序的外观。
2. 数据绑定：EXT支持将数据与组件进行绑定，以实现动态数据的展示和交互。
通过设置数据模型和绑定关系，可以在数据更新时自动更新组件的显示内容。
ext入门总结
ExtJs 学习Author: 石恺元datetime: 2010-11-24一．Ext简介ExtJS 是一种优秀的Ajax框架，可以用来开发带有华丽外观的RIAlto(富客户端)的Ajax应用，使得我们的B/S应用更加具有活力。
由于他是一种用JavaScript编写，与后台技术无关的前端Ajax框架因此，可以把ExtJS用在.net,java,php等多种开发语言中。
Ext使用做出来的东西很像桌面程序 ExtJS开始基于YUI技术，由开发人员jack Slocum 开发，通过参考Java Swing等机制来组织可视化组件，无论从UI界面上CSS样式,数据解析上的异常处理Ext都很优秀。
要使用ExtJs，那么首先要得到ExtJx文库文件,该框架是一个开源的，可以直接从官方网站上下载网址是/products/js/download.php然后根据提示进入下载页面。
二．准备工作需要三个工具：1. ExtJs的主程序包2.AdobeAIR 是Abode的一个支持工具3.（必须先安装adoair然后才能装这个，ext的视API，会创建一个桌面图标，很好看的一个工具）三．核心包打开ext2.3核心包有以下内容：adaper: 负责第三方提供的底层库(包括Ext自带的底层库)映射为Ext所支持的底层库buile : 压缩后ext全部的源码(里面分类存放).docs : API帮助文档（这个文档需要一个adobe的一个工具）exmaples: 提供使用ExtJs 的例子resources: Ext UI 资源文件目录，如CSS，图片等。
source : 无压缩Ext全部的源码(里面分类存放)遵从Lesser GNU (LGPL)开源协议。
ext-all.js :压缩后ext的全部源码。
ext-all-debug.js : 无压缩ext的全部源码用于调试ext-core.js : 压缩后Ext的核心组件，包括source/core 下的所以类ext-core-debug.js : 无压缩Ext核心组件，包括source/core下的所有类【注: 压缩的源码实际上就是把源码无换行，无空格，所以源程序在一行】我们要用到的文件：样式文件：ressources/css/ext-all.cssext文库主要有两个：adapter/extext-base.js以及ext-all.js,其中ext-base.js表示基础包，ext-all.js表示核心库（appdaper表示配置器，也就是说可以有多种配置器也就是说用其他几个也行）。
学习EXT
学习EXT第一天(EXT简介1)无论你是Ext库的新手，抑或是想了解Ext的人，本篇文章的内容都适合你。
本文将简单地介绍Ext的几个基本概念，和如何快速地做出一个动态的页面并运行起来，假设读者已具备了一些JavaScript经验和初级了解HTML Dom。
否则的话，请从阅读初学JavaScript资源开始。
下载Ex t如果你未曾下载过，那应从这里下载最新版本的Ext /downloads。
针对你的下载需求，有几个不同的弹性选项。
通常地，最稳定的版本，是较多人的选择。
下载解包后，那个example文件夹便是一个探索Ext的好地方！开始！我们将使用Ext，来完成一些JavaScript任务。
第一步要做的是，下载本教程的示例文件。
Zip文件包括三个文件：ExtStart.html, ExtStart.js和ExtStart.css。
解包这三个文件到Ext的安装目录中（例如，Ext是在“C:\code\Ext\v1.0”中，那应该在"v1.0"里面新建目录“tutorial”。
双击ExtStart.htm，接着你的浏览器打开启动页面，应该会有一条消息告诉你配置已完毕。
如果是一个Javascript错误，请按照页面上的指引操作。
在你常用的IDE中或文本编辑器中，打开ExtStart.js看看：Ext.onReady可能是你接触的第一个方法。
这个方法是指当前DOM加载完毕后，保证页面内的所有元素能被Script引用（reference）。
你可删除alert()那行，加入一些实际用途的代码试试：Ext.onReady(function() {alert("Congratulations! You have Ext configured correctly!");});El e m e n t：Ex t的核心大多数的JavaScript操作都需要获取页面上的某个元素（reference）,好让你来做有趣的事情。
ext入门学习
Ext入门学习一：Ext是什么ExtJS是一个javascript框架，用于在客户端创建丰富多彩的web应用程序界面。
ExtJS 可以用来开发RIA也即富客户端的AJAX应用。
ExtJs最开始基于YUI技术，由开发人员Jack Slocum开发，通过参考Java Swing等机制来组织可视化组件。
二：Ext能干什么主要是用来制作富客户端的Web应用。
包括但不限于：（1）可以动态创建web组件，动态维护web的Dom对象（2）灵活地获取界面组件对象，方便对对象的操作和控制（3）大量的组件对象帮助构建复杂的web应用（4）友好的Ajax支持（5）完善的事件处理机制三：Ext有什么四：Ext的HelloWorld1：环境准备（1）到官网上下载最新的版本，目前是ext-3.0-rc1.1（2）下载后解压后，看看里面的包结构：adapter：负责将里面提供的第三方底层库（包括Ext自带的底层库）映射为Ext所支持的底层库。
build：压缩后的ext全部源码(里面分类存放)。
docs： API帮助文档。
exmaples：提供使用ExtJs技术做出的小实例。
resources：Ext UI资源文件目录，如CSS、图片文件都存放在这里面。
package：按包分类的源码source：无压缩Ext全部的源码(里面分类存放) 遵从Lesser GNU （LGPL）开源的协议。
Ext-all.js：压缩后的Ext全部源码。
ext-all-debug.js：无压缩的Ext全部的源码(用于调试)。
ext-core.js：压缩后的Ext的核心组件，包括sources/core下的所有类。
ext-core-debug.js：无压缩Ext的核心组件，包括sources/core下的所有类。
（3）开发的时候只需要把resources包中的css和images放到common下面，还有把ext-all.js和adapter/ext/ext-base.js放入到js中就可以了2：HelloWorld.html<html><head><title></title><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><link rel="stylesheet" type="text/css" href="/ext3test/common/css/ext-all.css" /><script type="text/javascript" src="/ext3test/common/js/ext-base.js"></script> <script type="text/javascript" src="/ext3test/common/js/ext-all.js"></script></head><script language="javascript">Ext.onReady(function(){alert("Hello Ext3.0，你好");});</script>五：Ext的面向对象简介//相当于Java的packagespace("");//完全使用Ext的创建对象语法太繁琐，还是用我们熟悉的js的语法来写.Class1=function(){this.aa = "cc";this.t1=function(){this.aa="t1";};};.Class2=function(){this.t1=function(){this.aa="cc2 tt2";};};//表示Class2继承Class1，这里面没有采用Ext的extends.Class2.prototype=new .Class1();//或者使用这个Ext提供的语法//Ext.extend(.Class2,.Class1);//这个是Ext可以给一个对象动态的追加属性和方法Ext.apply(.Class1.prototype,{bb:"bb",cc:"cc",dd:function(){alert("ddd")}} );六：如何获取界面上的元素——Ext的选择器1：Ext.Element：Ext的核心对象，是Ext的基础。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
Ext入门学习一：Ext是什么ExtJS是一个javascript框架，用于在客户端创建丰富多彩的web应用程序界面。
ExtJS 可以用来开发RIA也即富客户端的AJAX应用。
ExtJs最开始基于YUI技术，由开发人员Jack Slocum开发，通过参考Java Swing等机制来组织可视化组件。
二：Ext能干什么主要是用来制作富客户端的Web应用。
包括但不限于：（1）可以动态创建web组件，动态维护web的Dom对象（2）灵活地获取界面组件对象，方便对对象的操作和控制（3）大量的组件对象帮助构建复杂的web应用（4）友好的Ajax支持（5）完善的事件处理机制三：Ext有什么四：Ext的HelloWorld1：环境准备（1）到官网上下载最新的版本，目前是ext-3.3-beta（2）下载后解压后，看看里面的包结构：adapter：负责将里面提供的第三方底层库（包括Ext自带的底层库）映射为Ext所支持的底层库。
build：压缩后的ext全部源码(里面分类存放)。
docs： API帮助文档。
exmaples：提供使用ExtJs技术做出的小实例。
resources：Ext UI资源文件目录，如CSS、图片文件都存放在这里面。
package：按包分类的源码source：无压缩Ext全部的源码(里面分类存放) 遵从Lesser GNU （LGPL）开源的协议。
Ext-all.js：压缩后的Ext全部源码。
ext-all-debug.js：无压缩的Ext全部的源码(用于调试)。
ext-core.js：压缩后的Ext的核心组件，包括sources/core下的所有类。
ext-core-debug.js：无压缩Ext的核心组件，包括sources/core下的所有类。
（3）开发的时候只需要把resources包中的css和images放到common下面，还有把ext-all.js和adapter/ext/ext-base.js放入到js中就可以了2：HelloWorld.html<html><head><title></title><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><link rel="stylesheet" type="text/css" href="/ext3test/common/css/ext-all.css" /><script type="text/javascript" src="/ext3test/common/js/ext-base.js"></script> <script type="text/javascript" src="/ext3test/common/js/ext-all.js"></script></head><script language="javascript">Ext.onReady(function(){alert("Hello Ext3.0，你好");});</script>五：Ext的面向对象简介//相当于Java的packagespace("");//完全使用Ext的创建对象语法太繁琐，还是用我们熟悉的js的语法来写.Class1=function(){this.aa = "cc";this.t1=function(){this.aa="t1";};};.Class2=function(){this.t1=function(){this.aa="cc2 tt2";};};//表示Class2继承Class1，这里面没有采用Ext的extends.Class2.prototype=new .Class1();//或者使用这个Ext提供的语法//Ext.extend(.Class2,.Class1);//这个是Ext可以给一个对象动态的追加属性和方法Ext.apply(.Class1.prototype,{bb:"bb",cc:"cc",dd:function(){alert("ddd")}} );六：如何获取界面上的元素——Ext的选择器1：Ext.Element：Ext的核心对象，是Ext的基础。
Element包含了常见的DOM方法和属性，提供一个快捷的、统一的、跨浏览器的接口（若使用Element.dom的话，就可以直接访问底层DOM的节点。
）；2：Ext.get(要获取对象的id)Element.get()方法提供内置缓存（Cache），多次访问同一对象效率上有极大优势；内置常用的DOM节点的动作，并且是跨浏览器的定位的位置、大小、动画、拖放等等（添加/移除 CSS 类, 添加/移除事件处理程序, 定位, 改变大小, 动画, 拖放）。
3：获取多个元素——DomQuery（1）元素选择符selector：Ext.query(元素类型名称如：”div”);Ext.query(第一个参数元素类型名称，第二个参数是#元素的id);Ext.query(#元素的id);Ext.query(.元素的class);Ext.query(*号返回所有的元素);Ext.query("div input")//获取div下的子元素(2)属性选择符Ext.query("*[class]")//获取所有有class属性的元素Ext.query("*[class=hello] )"//获取所有class=hello的元素Ext.query("*[class!=hello]" )// 获取所有class不等于hello的元素Ext.query("*[class^=h]" )// 获取所有以h开头的元素Ext.query("*[class$=h]" )// 获取所有以h结尾的元素Ext.query("*[class*=hello]" )// 获取所有包含hello的元素（3）CSS值元素选择符语法格式：元素{CSS的属性操作符值}Ext.query("*{color=red}")//获取Css属性中color为red的元素操作符同样可以是：!=,^,$,*等（4）伪类选择符Ext.query("span:first-child"); // SPAN元素为, 其父元素的第一个子元素Ext.query("a:last-child") //A元素为其父元素的最后一个子元素Ext.query("span:nth-child(2)") //SPAN元素为其父元素的第2个子元素（由1开始的个数）Ext.query("tr:nth-child(odd)") //TR元素为其父元素的奇数个数的子元素Ext.query("li:nth-child(even)") //LI元素为其父元素的偶数个数的子元素Ext.query("a:only-child") //返回A元素，A元素为其父元素的唯一子元素Ext.query("input:checked") //返回所有选中的（checked）的INPUT元素Ext.query("tr:first") //返回第一个的TR元素Ext.query("input:last") //返回最后一个的INPUT元素Ext.query("td:nth(2)") //返回第二个的TD元素Ext.query("div:contains(within)") //返回每一个包含“within”字符串的DIVExt.query("div:not(form)") //返回没有包含FORM子元素以外的那些DIVExt.query("div:has(a)") //返回包含有A元素的那些DIV集合Ext.query("td:next(td)") //返回接着会继续有TD的那些TD集合。
尤其一个地方是，如果使用了colspan属性的TD便会忽略Ext.query("label:prev(input)")//返回居前于INPUT元素的那些LABEL元素集合Ext.query和Ext.select的作用同是根据CSS选择符,基本的XPath,HTML属性等查找出一个或多个元素。
区别在于返回类型上。
分别是：query方法返回的是JavaScript标准的数组类型；select方法返回的是CompositeElement类型，试比较七：响应事件Ext.get("btn_add").on("click",function(){alert("哈哈，点击了");});添加事件方式跟JQuery类似。
如何得知这个event handler执行时是作用在哪一个特定的元素上呢？自动传入event: Ext.get("btn_add").on("click",function(e){alert("哈哈，点击了=="+e.target.value);});八：数据操作Store、Record、Reader等Store是在Js端的小型内存数据中心，js组件从store里面取值Record是记录，主要就是描述store里面每一条值，基本是key-valueReader是解析器，就是从原始数据读成需要的对象。
比如：var sexStore = new Ext.data.JsonStore({url: "a.jsp",fields: ['sexTrue', 'sexShow'],listeners: {'load': function(){ alert("now load"); }}});sexStore.load();后台返回的值：<%@ page contentType="text/html; charset=gb2312" %><%out.println("[{sexTrue:'1',sexShow:'男人'},{sexTrue:'2',sexShow:'女人'}]"); %>九：使用组件——Widgets1：Ext.Button（1）//初始化var btn_add = new Ext.Button({//设置属性text:"新增",//显示出来renderTo:Ext.getBody()});（2）//显示按钮的属性，要注意这个text和上面的text在Ext里面不同，上面那个是Config，用在构造对象的时候，这个是属性，用来取值用alert(btn_add.text);（3）添加事件：var btn_add = new Ext.Button({text:"新增",renderTo:Ext.getBody(),handler:function(){alert("哈哈，点击我");}});handler ：用于处理默认的事件，button就是click还有一种跟swing一样的机制，listeners:var btn_add = new Ext.Button({text:"新增",renderTo:Ext.getBody(),handler:function(){alert("哈哈，点击我");},listeners:{"click":function(){alert("now is click11");},"click":function(){alert("now is click22");},"afterrender":function(){alert("afterrender");}}});A：可以在listeners里面添加很多事件注册B：相同的事件，后面的覆盖掉前面的，但不影响handler的触发还有一种写法：var btn_add = new Ext.Button({text:"新增",minWidth:100,renderTo:Ext.getBody(),handler:function(){alert("哈哈，点击我");},listeners:{"click":function(){alert("now is click11");},"click":function(){alert("now is click22");},"afterrender":function(){alert("afterrender");}}});btn_add.on("click",function(){alert("now is click333");});btn_add.on("click",function(){alert("now is click444");});A：可以添加很多个，相同的也没有关系，都会运行，形成一个事件链B：可以和handler、listeners共存2：Ext.form.TextFieldExt.onReady(function(){var btn_add = new Ext.Button({text:"新增",renderTo:Ext.getBody()});btn_add.on("click",function(){alert("now is click444=="+userId.getValue());});var userId = new Ext.form.TextField({fieldLabel:"用户编号",renderTo:Ext.getBody()});});A：会发现：虽然出现了文本框，而且可以操作，点击按钮也能取得文本框的值，但是前面的标签并没有出来，原因是没有使用布局，layout。