ExtJS Element Component DOM 的获取
来源:互联网 发布:母亲节刷朋友圈知乎 编辑:程序博客网 时间:2024/05/17 02:31
- 发布时间: 2014/11/26 17:41
- 阅读: 400
- 收藏: 1
- 点赞: 1
- 评论: 0
1、获取Element元素:
1)Ext.get == Ext.Element.get 获取元素后放在缓存中下次查找时从缓存中获取,所以需要多次调用这个元素的时候应该使用这个方法。
2)Ext.fly == Ext.Element.fly 获取元素后直接返回,而且该元素不会缓存在系统中。所以只需一次操作时最好调用这个方法。
3)Ext.select 用法与 Ext.query 基本相同,然而二者的差异是返回值。前者返回的是CompositeElementLite对象,该对象保存了选择器所选择的元素,同时以Element形式存储,换句话说,Ext.select 是把 Ext.query 的元素进行了封装。
4)Ext.getDoc() 返回Document 的 Ext.Element 元素 ,类似于 Ext.get(document)
5)Ext.getBody 返回Body 的 Ext.Element 元素 ,类似于 Ext.get(document.body || document.documentElement);
2、获取HTML DOM元素:
1)Ext.query == Ext.DomQuery.select 获取原生DOM元素集合,他并不是Ext封装的Element元素集合,而是HTML的DOM数组
2)Ext.getDom() 返回HTML 原生的 DOM元素
3、获取Component元素:
1)Ext.getCmp == Ext.ComponentMgr.get 返回Component组件
2)component对象可以通过 ownerCt 获取父组件 , 可以通过 items 获取子组件
3)componet.getComponent(index||id) 获取子组件,等价于 component.items.get(index || id);
4)componet.findParentByType() 获取父组件
5)componet.findByType() 获取子孙组件
4、Component、Element、HTMLDOM 之间相互转换
1)componet.getEl() == component.el 组件获取元素
2)element.dom 元素获取HTML DOM
3)Ext.get(dom) HTML DOM 转为 Element
4)Element 或者 HTML DOM 是无法转换 Component 的,因为 Component需要运行渲染时在ComponentMgr中注册。但是,我们可以通过ID进行间接获取,如下方法,不过这样不能保证我们一定获取到组件,所以使用时还要做一个是否为空的判断
HTML DOM 转 Component :Ext.getCmp(dom.id)
Element 转 Component:Ext.getCmp(element.id)
//----------------------get sourcecode-------------------------------------------
El.get = function(el){
var ex,
elm,
id;
if(!el){ return null; }
if (typeof el == "string") { // element id
if (!(elm = DOC.getElementById(el))) {
return null;
}
if (EC[el] && EC[el].el) {
ex = EC[el].el;
ex.dom = elm;
} else {
ex = El.addToCache(new El(elm));
}
return ex;
} else if (el.tagName) { // dom element
if(!(id = el.id)){
id = Ext.id(el);
}
if (EC[id] && EC[id].el) {
ex = EC[id].el;
ex.dom = el;
} else {
ex = El.addToCache(new El(el));
}
return ex;
} else if (el instanceof El) {
if(el != docEl){
// refresh dom element in case no longer valid,
// catch case where it hasn't been appended
// If an el instance is passed, don't pass to getElementById without some kind of id
if (Ext.isIE && (el.id == undefined || el.id == '')) {
el.dom = el.dom;
} else {
el.dom = DOC.getElementById(el.id) || el.dom;
}
}
return el;
} else if(el.isComposite) {
return el;
} else if(Ext.isArray(el)) {
return El.select(el);
} else if(el == DOC) {
// create a bogus element object representing the document object
if(!docEl){
var f = function(){};
f.prototype = El.prototype;
docEl = new f();
docEl.dom = DOC;
}
return docEl;
}
return null;
};
//-------------------------- fly sourcecode --------------------------------
El.fly = function(el, named){
var ret = null;
named = named || '_global';
if (el = Ext.getDom(el)) {
(El._flyweights[named] = El._flyweights[named] || new El.Flyweight()).dom = el;
ret = El._flyweights[named];
}
return ret;
};
- ExtJS Element Component DOM 的获取
- Extjs 理解Html DOM、 Element及Component
- ExtJS学习之路第二步:Ext.Component 和 Ext.dom.Element 的区别
- Ext dom element component
- Ext Element与Component与Dom关系
- 理解Html DOM、Ext Element及Component
- Ext Element与Component与Dom关系
- 理解Html DOM、Ext Element及Component
- ExtJs 获取Dom对象
- ExtJs 获取Dom对象
- ExtJS 操作DOM元素Ext.Element
- ExtJs学习(二) Ext.dom.Element
- Html DOM、Ext Element及Component三者之间的区别(Ext入门基础)
- Html DOM、Ext Element及Component三者之间的区别(Ext入门基础)
- ExtJs之获取dom元素
- ExtJS学习--------Ext.Element中的对Dom操作的方法学习(实例)
- dom element
- ExtJS学习笔记(十二) Ext 获取组件、获取DOM
- Keil uVision4使用总结
- Thrift框架学习笔记 IOS/MAC中使用Thrift框架
- OpenCV中值模糊方法
- Java NIO系列教程(五) 通道之间的数据传输
- 【ny-oj】-366-D的小L(STL-全排列(next_permutation()))
- ExtJS Element Component DOM 的获取
- c++基础温习之指针分配空间
- 关于InstantiationException错误的原因
- 输入数字n,按顺序打印出从1到最大的n位十进制数
- iOS开发之使用Code Snippet创建代码片段
- Spring-MVC 登录拦截与静态资源冲突的问题
- 换钱的最少货币数
- 博客第一步
- 基于GephiSDK的数据可视化功能开发