`
chenyuxiaoxiao
  • 浏览: 71326 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

Extjs 讲解

阅读更多
原文http://www.cnitblog.com/yemoo/archive/2007/12/18/37850.html
Ext.util.Observable:一个抽象基类,为事件机制的管理提供一个公共接口,如果你希望的类可以有事件,就继承它吧
Ext.apply:如果只传入两个参数,则将C继承D的所有方法属性,如果定义了B则每次都先继承B的方法属性然后再继承D的方法属性,即B是默认继承对象
1、Ext.apply(Object obj, Object config, Object defaults ) : Object
将config中的所有属性复制到obj中,如果配置了defaults,则先将defaults中的属性传入obj,然后再将config中属性传入,一般defaults用于定义一些默认值。
注意:每个参数都必须是对象object,而不能是function或其他。
创建object可以通过new function(){}、new Object()、{}等方法创建。

2、Ext.emptyFn: Function
用于返回一个空函数,便于在程序中创建空函数。Ext.emptyFn返回function(){}

3、Ext.applyIf(Object obj, Object config) : Object
功能如同Ext.apply,但是只把config中存在而obj不存在的属性复制过去。

4、Ext.addBehaviors( Object obj ) : void
为页面中一个或多个元素添加事件
元素使用css规则查找,其中元素与事件用@隔开
Ext.addBehaviors({
   //为id为foo的元素下的所有a元素添加click事件
   '#foo a@click' : function(e, t){
       // do something
   },
   // 为多个选择器添加相同的事件(mouseover)。在@之前使用逗号分开
   '#foo a, #bar span.some-class@mouseover' : function(){
       // do something
   }
});

5、Ext.id( [Mixed el], [String prefix] ) : String 
返回一个唯一的id值。
如果只需要获取一个唯一的id值,则直接调用Ext.id();
如果需要为某个元素设定一个唯一的id值并返回id则调用Ext.id(el),el为元素Id、Dom对象或Ext的Element对象。
如果需要指定特定的前缀,则需要传入第二个参数,如Ext.id(el,”myPrix-”),默认前缀为ext-gen,如默认返回id可能为ext-gen4,指定了前缀后可能返回myPrix-4。

6、Ext.extend( Object subclass, Object superclass, [Object overrides] ) : void
实现对象继承,目前还不太了解具体原理 ???

7、Ext.namespace( String namespace1, String namespace2, String etc ) : void
创建命名空间:
如Ext.namespace("Company","MyNS.mydata","Data.format.string")
然后可以创建如MyNS.mydata.doit=function(){…}的接口
注:命名空间的简易调用:Ext.ns(),在Ext Api中未给出此用法。

8、Ext.urlEncode( Object o ) : String
将一个json对象转换称url参数串,支持通过数组为一个参数设定多个值。
如将{a:1,b:2,c:[1,3,5,7]}转换为a=1&b=2&c=1&c=3&c=5&c=7

9、Ext.urlDecode( String string, [Boolean overwrite] ) : Object
将url参数串转换为json对象,overwrite如果为true,则后面的同名参数值覆盖前面的同名参数值(默认为false即不覆盖而以数组形式返回)。

Ext.urlDecode("a=1&b=2&c=1&c=3&c=5&c=7")
返回的对象内容为{a:1,b:2,c:[1,3,5,7]}
Ext.urlDecode("a=1&b=2&c=1&c=3&c=5&c=7",true)
返回{a:1,b:2,c:7}

10、Ext.each( Array/NodeList/Mixed array, Function fn, Object scope ) : void
遍历array并对每项分别调用fn函数。如果array不是数组则只执行一次。
如果某项fn执行结果返回false(必须是false,undefined无效),遍历退出,后面的array项将不被遍历。
遍历过程中每次为fn传入参数分别为[当前数组项],[当前索引]和[数组array]三个参数。
Scope用于设定fn函数中的this指针。

Ext.each([1,3,5,7],function(v,i,a){
      alert("index: "+i+" value: "+v+" array.length:"+a.length)
});

将循环弹出:
index:0 value:1 array.length:4
index:1 value:3 array.length:4 
index:2 value:5 array.length:4 
index:3 value:7 array.length:4
Ext.each([1,3,5,7],function(v,i,a){
    alert("index: "+i+" value: "+v+" array.length:"+a.length);
    return v!=5;  //到第三项后遍历退出
});


将循环弹出:
index:0 value:1 array.length:4
index:1 value:3 array.length:4 
index:2 value:5 array.length:4 

11、Ext.combine(arg1,arg2..argn) : Array    //该方法在Ext2不推荐再使用
用于实现对数组的合并,如果是字符串则作为只有一项的数组合并。

var a1=[1,3,5],b1=["a","b","c"];var c1="xxyznbde";
Ext.combine(a1,b1,c1) 返回[1,3,5,a,b,c,xxyznbde]

12、Ext. escapeRe( String str ) : String
将属于正则里的特殊字符进行转义。

Ext.escapeRe("(ab)$\sa342{}[dd]")将返回\(ab\)\$sa342\{\}\[dd\]。

13、Ext.callback(cb, scope, args, delay) :void  //该方法为Ext的内部方法
调用一个函数或延迟调用一个函数。
Cb:调用的函数。
scope:cb中this指针。
args:传如cb的参数,以数组形式表示。
delay:延迟多少毫秒执行cb。

Ext.callback(function(x,y){alert(x+y)},this,[3,5],1000);将于1秒钟后弹出8,即3+5的结果。

14、Ext.getDom( Mixed el ) : HTMLElement
根据传入的id/dom节点/Ext的Elemenet对象,返回其dom对象。
如alert(Ext.getDom("a").innerHTML);或
alert(Ext.getDom(document.getElementById("a")).innerHTML);
将返回id为a的元素的innerHTML内容。

15、Ext.getDoc()/Ext.getBody() : Ext.Element
分别返回页面的document对象和body对象,返回值为Ext的Element对象,而非Dom对象。

16、Ext.getCmp( String id ) : Ext.Component
根据传入的html元素id返回该元素的组件类型,返回值为Ext的Component对象。
必须保证该id对象的元素是Ext的一个内部组件(通过Ext创建的组件),否则什么都不返回。

17、Ext.num( Mixed value, Number defaultValue ) : Number
验证value是否是一个数字,如果是则直接返回否则返回defaultValue。

alert(Ext.num(5,7))返回5,alert(Ext.num("5",7)) 返回7

18、Ext.destroy( Mixed arg1, Mixed (optional), Mixed (optional) ) : void
销毁创建的Element或组件(Component),即销毁其所有的事件监听,dom节点,并调用对象本身的destory方法(如果存在的话),传入的参数类型为Ext.Element或Ext. Component,可以一次性传入多个对象进行销毁。

Ext.destory(menu,el,Button);会销毁menu,el,Button三个对象。

19、Ext.removeNode(htmlElement el): void  //Ext内部方法
删除指定的dom节点。传入参数为dom对象。

Ext.removeNode(document.getElementById("ab"));

20、Ext.type( Mixed object ) : String
返回传入的对象的类型。
包括如下类型:
string,number,boolean,function,object,array,regexp,element,nodelist,textnode,whitespace

Ext.type("ab")返回string
Ext.type(20)返回number
Ext.type([3,5,6])返回array
Ext.type(/reg/)返回regexp
Ext.type(document.body)返回element。

21、Ext.isEmpty( Mixed value, [Boolean allowBlank] ) : Boolean
检查一个值是否为null/undefined或是否是空,如果是则返回true。
如果传入allowBlank为true,则只检查是否为null或undefined。
如:
Ext.isEmpty("a")返回false,
Ext.isEmpty("")返回true,
Ext.isEmpty("",true)返回false,
Ext.isEmpty(null)返回true。
分享到:
评论

相关推荐

    蔡世友EXTJS讲解extJs 提供大家学习

    蔡世友EXTJS讲解extJs 提供大家学习

    extjs讲解快速入门

    ext ppt查看 extjs讲解快速入门

    EXTJS讲解个人项目经历

    EXTJS 是一个强大的JavaScript前端框架,它主要用于构建富客户端应用,提供丰富的用户界面组件和灵活的可定制性。EXTJS 的核心在于其组件化的架构,允许开发者构建复杂的UI布局和功能丰富的应用程序。以下是对EXTJS...

    JAVA中的extjs讲解

    JAVA开发中的Extjs开发入门篇,希望能对大家有点帮助

    extjs 入门 ppt

    ExtJs入门.ppt ExtJs入门.ppt 大家学习学习

    ExtJs4 详细、讲解例子

    ExtJs4 详细、讲解例子,网上搜索的一些例子,拉下来的

    extjs实践大量实例讲解

    ### ExtJS 实践大量实例讲解 #### 概述 ExtJS 是一款用于构建现代 Web 应用的强大框架,它提供了一系列丰富的 UI 组件、数据处理功能以及与后端交互的能力。本文将通过大量的实例来讲解如何使用 ExtJS 来开发高...

    Extjs5.0 Mini 轻量级 使用方式概述 引用讲解 Extjs5.0 gray

    ExtJS 是一个强大的JavaScript应用程序框架,专用于构建富客户端Web应用。在5.0版本中,它提供了一个轻量级的版本,称为“Mini”,旨在减少应用的体积,提高加载速度,尤其适合对性能有较高要求或者需要快速开发的...

    深入剖析ExtJS_2.2实现及应用

    此外,本书还是一部JavaScript技术深度探讨的著作,它结合ExtJS源码讲解了JavaScript的高级特性,如正则表达式解析、函数调用、性能优化等,甚至对常被误解的`eval`函数也进行了详尽分析。这不仅对理解ExtJS有帮助,...

    ExtJS入门讲解教程

    一切从extjs发布包开始非常幸运的是,我们可以免费去extjs.com下载ext发布包,里边源代码,api文档,例子一应俱全。不过要是想访问svn获得最新的代码,就要花钱了。不过我们现阶段只要这个免费的发布包就可以了,...

    EXTJS4.0视频教程配套代码

    看到其它地方 分太高,问大家省点分. 只有代码,视频请百度看. 第一讲:extjs4.0概述和HELLO WORD程序 [01]EXTJS4.0的概述和HELLOWORD程序.wmv 第二讲:extjs4.0的新特性(附件... 第三十讲:extjs4.0的desktop使用讲解

    extjs中文文档大全

    同时,手册还会讲解EXT的布局系统,如Fit布局、Form布局和Table布局,以及如何使用Store和Model进行数据管理。 3. **Ext Core手册**:Ext Core是ExtJS的轻量级版本,保留了核心的组件和布局功能。对于那些只需要...

    Extjs4.1.1

    ExtJS是一种主要用于创建前端用户界面,是一个基本与后台技术无关的前端ajax框架,本课程是一套基于Extjs4.1.1版本进行全新讲解Extjs的课程。课程从基础开始,配合项目实战应用,让用户在最短的时间内掌握Extjs的...

    extJs2.0 中文手册

    接下来,ExtJs2.0中文手册会深入讲解事件处理机制。ExtJs2.0使用了一套成熟的事件模型来处理用户的交互。在手册中,您可以找到如何为组件添加事件监听器,以及如何处理事件的实例和最佳实践。 数据管理是ExtJs2.0的...

    传智播客EXTJS视频下载地址

    - **资源推荐**:《传智播客成都中心JavaScript面向对象及ExtJS基础视频》中的AJAX章节(PPT格式),通过实例讲解了如何使用ExtJS进行AJAX调用。 2. **浏览器对象模型(BOM)**:这部分资料讲解了浏览器对象模型的...

    EXTJS视频教程说明

    在本教程中,讲师通过大量实例详细讲解EXTJS的核心概念和技术,包括如何创建窗口、面板、表单、数据绑定等。教程注重理论与实践相结合,不仅教授EXTJS的语法和API,还深入探讨其背后的原理,使学习者能够理解EXTJS的...

    ExtJS Web应用程序开发指南(第2版)

    从基本的ExtJS功能开始讲解RIA Web开发,从而引出用户体验丰富的ExtJS技术。接着通过经典的“Hello World”来快速搭建和配置第一个程序。然后通过4章来详细讲解ExtJS的基本功能,包括:最常用的表单、面板和布局类,...

    Extjs教程源码

    Extjs教程源码 介: ***************第一部分基础知识**************** 第一讲: EXTJS4.0概述和HelloWorld程序 ...第三十讲: EXTJS4.0的Desktop使用讲解 本资料共包含以下附件: EXTJS4.0视频教程配套代码.zip

Global site tag (gtag.js) - Google Analytics