Extjs4.1 Ext.util工具包详解
一、Ext.util.CSS
概述：有效的控制样式表，可以多台的删除修改以及交换
主要方法：
1.createStyleSheet创建一个css样式在head中的标签
2.getRule根据类名得到一个CSSRule的对象
3.swapStyleSheet引入一个css样式文件并指定ID
4.removeStyleSheet用指定的id来删除一个样式
5.update修改样式表中的属性值
代码实现以及注释说明：
//1.createStyleSheet(StringcssText,String id) :StyleSheet 创建一个css样式在head中的标签
Ext.util.CSS.createStyleSheet(".c{color:red}","red");
Ext.get("d1").addClsOnOver("c");
//2.getRule(String/Arrayselector,Boolean refreshCache)根据类名得到一个CSSRule的对象，对象可以获取到里面指定属性
varcssobj=Ext.util.CSS.getRule(".c",true);
alert(cssobj.style.color);
//3.swapStyleSheet(Stringid,String url) 引入一个css样式文件并指定ID，交换样式表，将会把此样式表引入的数序靠前。多用于皮肤切换
vari=1;
Ext.get("b1").on("click",function(){
if(i%2==0){
Ext.util.CSS.swapStyleSheet("one","lession10/one.css");
Ext.get("d2").addClsOnOver("col");
i++;
}else{
Ext.util.CSS.swapStyleSheet("two","lession10/two.css");
Ext.get("d2").addClsOnOver("col");
i++;
}
});
//4.removeStyleSheet(Stringid) 用指定的id来删除一个样式
Ext.get("b2").on("click",function(){
Ext.util.CSS.removeStyleSheet("red");
});
//5.updateRule(String/Arrayselector,String property,String value) :Boolean 参数为类名、属性名、值
Ext.get("b3").on("click",function(){
Ext.util.CSS.updateRule(".c","color","#990055");
});
二、Ext.util.ClickRepeater
概述：单机一次，如果不失去焦点。系统自动会去请求 主要用于挤房器和网络忙的时候请等待的功能
直接实例化这个类，第一个参数为 组件的元素对象，第二个为配置对象
delay 首次单机时候的间隔时间
interval发生首次重复事件调用之后每一次事件的间隔时间
stopDefault停止这个el上的默认单机事件
handler执行的动作
//控制元素在指定时间内被单机(如果元素没有失去焦点)
//第一次单击马上会触发事件，如果不去点击其他的元素那么3秒后会自动执行第二次
//以后会以4秒的间隔执行相应的程序
varc1=new Ext.util.ClickRepeater(Ext.get("b4"),{
delay:3000,//首次单机时候的间隔时间
interval:4000,//发生首次重复事件调用之后每一次事件的间隔时间
stopDefault:true,//停止这个el上的默认单机事件
handler:function(){
alert("单机我");
}
});
三、Ext.util.DelayedTask
概述：在规定的时间之后调用函数
创建对象指定一个function为参数
主要方法：delay 参数执行时间， 表示多少时间后触发该对象的函数
cancel移除正在等待的最后一个函数
代码：
//实例化对象，并传入一个可执行的函数为参数
varc1=new Ext.util.DelayedTask(function(){
alert("-------");
});
Ext.get("b5").on("click",function(){
c1.delay(2000);//在2秒后调用，也可以传入第二个参数，参数为执行函数。
c1.cancel();//移除在最后等待的事件
});
四、Ext.util.Format
格式化表示数值和日期等
主要方法：
1.ellipsis当超过位超过指定值时，用...来表示
2.capitalize将首字母变为大写， 一般用于得到它的set和get方法的时候常用
3.date格式化输出日期，第一个传入日期对象， 第二个传入格式
4.substr截取字符串操作
5.lowercase将所有大写转化为小写
6.number讲数值以一定的格式去输入，因为各国的数值表示不同
7.nl2br将JS中的换行\n解析成<br>标签
代码实现：
varstr="[email protected]";
//1.ellipsis()参数第一为字符串，第二个为当超过位超过此值时，用...来表示
alert(Ext.util.Format.ellipsis(str,10));
//2.capitalize()将首字母变为大写， 一般用于得到它的set和get方法的时候常用
alert(Ext.util.Format.capitalize(str));
//3.date()格式化输出日期，第一个传入日期对象， 第二个传入格式
alert(Ext.util.Format.date(newDate(),"Y年-m月-d日"));
//4.substr截取字符串操作
alert(Ext.util.Format.substr(str,0,5));
//5.lowercase将所有大写转化为小写
alert(Ext.util.Format.lowercase("MARICO"));
//6.number讲数值以一定的格式去输入，因为各国的数值表示不同
alert(Ext.util.Format.number(123123.123123,"0,000.00"));
//7.nl2br将JS中的换行\n解析成<br>标签
alert(Ext.util.Format.nl2br("marico\nzhang"));
五、Ext.util.MixedCollection对象集合类
概述：可以增加对应的键值对，相当于java的一个Map集合，适合做缓存和静态常量，方便管理
主要方法：
1.集合类的add(String key,Object o) 添加一个对象到集合类中,也可以在第一个参数指定的相应的key值
2.addAll(Object/Arrayobjs)方法。 增加一个数组或者一个集合类
3.clear方法 移除里面所有的对象
4.clone克隆 等于复制对象
5.判断集合中是否有相应的对象 contains(Objecto) containsKey(String key) 返回一个boolean值
6.each(functionfn,[Object scope]) :void 遍历这个集合类
7.从集合中得到单个的对象
get(String/Numberkey): Object 根据key得到指定的对象
first()得到集合类中的第一个对象
8.集合的有关事件 当执行add,clear,remove,replace方法的时候可以指定触发的事件,可以on方法来指定
事件，参数一为执行什么操作，第二个是函数，函数参数第一个为这个对象的坐标，第二个为这个对象，第三个为
这个对象key值
代码实现：
//1.集合类的add(String key,Object o) 添加一个对象到集合类中,也可以在第一个参数指定的相应的key值
varitem1=new Ext.util.MixedCollection();
vara={name:'a'};
varb={name:'b'};
item1.add("01",a);
item1.add("02",b);
//alert(item1);
//2.addAll(Object/Arrayobjs)方法。 增加一个数组或者一个集合类
vararr=[a,b]
varitem2=new Ext.util.MixedCollection();
item2.addAll(arr);
//alert(item2);
//3.clear方法 移除里面所有的对象
item2.clear();
//alert(item2);
//4.clone克隆 等于复制对象
varitem3=item1.clone();
//alert(item3);
/*
* 5.判断集合中是否有相应的对象
* contains(Object o): 返回一个boolean值
* containsKey(String key):Boolean
* */
//alert(item3.contains(a));
//alert(item3.containsKey("01"));
//6.each(functionfn,[Object scope]) :void 遍历这个集合类
item1.each(function(item){
//alert(item.name);
});
//7.从集合中得到单个的对象
//get(String/Numberkey): Object 根据key得到指定的对象
//first()得到集合类中的第一个对象
//alert(item1.get("01").name);
//alert(item1.get(1).name);
//alert(item1.first().name);
//8.集合的有关事件
//add,clear,remove,replace
item1.on("add",function(index,o,key){
alert("集合item1有了一个新的成员："+key);
});
item1.add("03",{name:"c"});
六、Ext.util.TashRunner
概述：主要操作的为线程，可以实现线程的运行和停止，多个线程之间互不影响，与java中的多线程机制相似
1.实例化一个Ext.util.TaskRunner类的对象
2.定一个线程的对象 里面指定属性：
run指定的为function，表示线程开启后执行的函数
interval指定的为一个时间数，表示每隔多少事件执行run指定的函数
3.调用start方法开启线程 传入的一个线程的对象
4.调用stop方法停止线程，传入的是需要停止的那个线程的对象
varrunner=new Ext.util.TaskRunner();
vartask={
run:function(){
Ext.getDom("input").value=Ext.util.Format.date(newDate(),"Y-m-d-s");
},
interval:1000
};
runner.start(task);
Ext.get("b6").on("click",function(){
runner.stop(task);
});