标签:auto 位置 value attribute insert 迭代 高亮 ems elm
常用方法和属性(Common methods and attributes)
获取
get(x)
x是元素的ID || dom元素对象 || ExtElement对象
将参数所指转化为ExtElement对象并返回它(非Dom元素对象,而是对Dom元素的封装),此方法等同于new Ext.Element(x) 。
Ext.select(x)
x是选择器
返回一个CompositeElement对象,表示ExtElment对象的集合。但返回的这个对象实际上并非数组,不能通过数组索引访问它包含的数据。但可以通过each方法对集合里的每个对象进行迭代。
Ext.query(x)
x是选择器
返回html dom元素对象数组。此方法是Ext.DomQuery.select()的简写形式。
Ext.DomQuery.filter(CompositeElement,selector,mach)
CompositeElement是ExtElement对象集合,selector是选择器,mach是布尔值,意为是否取反。
从集合中筛选出符合selector的对象,然后mach再筛选一次。返回CompositeElement集合。
Ext.DomQuery.is(domElement,selector)
domElement是html Dom元素对象 || html Dom元素对象集合,selector是筛选器。
测试domElement是否匹配筛选器。
ExtElmentArray.each(fn)
fn是函数
迭代CompositeElement集合对象,该集合包含的是ExtElement对象。fn用于处理迭代,函数接收一个参数e,e表示被迭代的每个ExtElment对象。
Array.forEach(fn)
fn是函数
迭代数组的元素,fn用于处理迭代,函数接收一个参数e,e表示被迭代的每个数组的元素。如果你要迭代ExtElment对象就应该使用each方法,如果迭代数组就使用forEach方法。
Ext.each(x,fn)
x是数组对象 || CompositeElement集合对象
fn是函数用于处理迭代,函数接收三个参数item、index、allItems,item是当前迭代的某个数组的元素或CompositeElement集合中的ExtElement对象,index是索引,allItems是x。
Ext.getDoc()
获取html文档对象的ExtElement对象表示。
Ext.getBody()
获取Body元素的ExtElement对象表示。
Ext.getDom(x)
x是元素的ID || html Dom元素对象 || ExtElement对象
获取对象的Dom对象表示。
Ext.getCmp()
获取Ext组件,得到组件后可调用以set为前缀的函数方法用以设置组件的各种属性。
Ext.isEmpty(x)
x是对象 || 字符
测试对象是否为空,如果是测试字符,则需要提供第二个参数指定是否可以为空。
ExtElment.hide()
隐藏ExtElment对象。
ExtElm.highlight();
使ExtElment背景高亮显黄渐隐的动画。
ExtElement.on(eventType,fn)
eventType是事件触发方式,fn是事件处理函数。
<div id="TestBox" style="width:100px;height:100px;background:black;color:white;margin:200px auto;text-align:center;">click</div>
<script type="text/javascript">
Ext.onReady(function () {
Ext.get("TestBox").on("click", function () {
Ext.MessageBox.alert("","event click!");
});
});
</script>
属性
ExtElment.dom
获取ExtElement对象的Dom表示,相当于转化为Dom元素。
操纵
Ext.DomHelper.append(fatherElm,x)
fatherElm是html Dom对象 || ExtElement对象,x是htmlCode
将x添加到fatherElm里的末尾。
Ext.DomHelper.applyStyles(x,styleObject)
x是html Dom对象 || ExtElement对象
设置x的css。
Ext.DomHelper.applyStyles(Ext.get("box"), { "font-size": "50px" })
Ext.DomHelper.insertAfter(x,y)
x是ExtElement对象,y是htmlCode || html Dom对象 || ExtElement对象
将y插入到x之后。
Ext.DomHelper.insertBefore(x,y)
x是ExtElement对象,y是htmlCode || html Dom对象 || ExtElement对象
将y插入到x之前。
Ext.DomHelper.insertHtml(where,x,y)
x是html Dom对象,where是指示条件
根据where的指示,将y插入到x的由where指示的某个位置。where可能的值有:beforeBegin(插入到x的开始标签之前)afterBegin(插入到x的开始标签之后)afterEnd(插入到x的结束标签之后)beforeEnd(插入到x的结束标签之前)
Ext.DomHelper.markup(x)
x是ExtElement对象 || html Dom对象
获取该对象的html块。
Ext.DomHelper.overwrite(x,y)
x是ExtElement对象 || html Dom对象
用y替换x包含的所有html。
Ext.DomHelper.createTemplate(x)
x是htmlCode
创建一个html模板。此方法的好处在于简化需要重复创建相同结构的html以便于重复调用用于生成html或用于其他操作。
<script type="text/javascript">
var htmlTemplate = Ext.DomHelper.createTemplate("<div id=‘{id}‘>{value}</div>");//创建模板同时定义占位变量id和value
htmlTemplate.append(Ext.get("box"), { id: "childBox1",value:"hello" });//在参数1里添加一个id为childBox1文本为hello的div
htmlTemplate.append(Ext.get("box"), { id: "childBox2", value: "world" });//在参数1里添加一个id为childBox2文本为world的div
</script>
标签:auto 位置 value attribute insert 迭代 高亮 ems elm
原文地址:http://www.cnblogs.com/myrocknroll/p/7069340.html