使用 window.document.getElementById 访问 Ext JS 组件

Question

是否可以使用 window.document.getElementById 访问 Ext JS 组件？而不是使用Ext.getCmp。

Answer 1

不，您将获得没有 ExtJS 包装器的本机对象。

Answer 2

按元素查找组件实际上相当简单;每个组件都有一个 main 元素，其 id 属性与组件的id匹配。所以我们可以这样做：

function findComponentByElement(node) {
    var topmost = document.body,
        target = node,
        cmp;
    while (target && target.nodeType === 1 && target !== topmost) {
        cmp = Ext.getCmp(target.id);
        if (cmp) {
            return cmp;
        }
        target = target.parentNode;
    }
    return null;
}
var node, cmp;
node = document.getElementById('foo');
cmp  = findComponentByElement(node);

如果你有一个 Ext.Element 实例而不是裸露的 HTMLElement，只需传递它的 DOM 指针：

var el, cmp;
el  = Ext.Element.getActiveElement(); // Currently focused element
cmp = findComponentByElement(el.dom);

哦，为了完整起见，以下是为HTML获取Ext.Element包装器的方法：

var node, el;
node = document.getElementById('bar');
el   = new Ext.Element(node);