将DOM元素ID追溯到其ExtJs组件

我们正在为使用ExtJs构建的Web应用程序开发基于Web的自动化解决方案。将DOM元素ID追溯到其ExtJs组件

目前我正在测试各种不同的对象识别技术，以最好的方式识别Web元素。

我们希望使用IE开发人员工具（F12）在页面上突出显示和选择DOM对象，并以某种方式获取相应的ExtJs组件（及其相应的属性，如itemId）。

这是可能通过代码或通过其他技术做到这一点吗？

来源

2012-11-05 lysergic-acid

是的，你的答案的伎俩。使用DOM ID的GetCmp为我提供了组件的参考，这正是我所需要的。 –

我不熟悉IE开发工具这种事情，但我可以尝试回答针对特定组件和它们的元素。

您可以通过多种方式目标分机组成：

Ext.ComponentQuery.query(CQselector)方法（）
Ext.getCmp(componentID)，如果你知道组件编号
向上（）和向下（）从任何容器/组件的方法。这些也取CQ选择器表达式

这些方法中的任何一个都可以在Ext库加载后从页面访问。在FF和Chrome等浏览器中，您可以直接从控制台执行这些方法。我猜他们应该可以在IE开发工具中使用。

一旦你参考了Ext组件，你可以通过.dom或.el或类似的属性获得HTML元素。或者你可以直接使用Dom query。

来源

2012-11-05 22:49:43 dbrin

我相信如果你设置了id属性而不是itemId，你可以达到所需的结果，因为这是作为组件的顶级容器的html id属性传递的（我想！）。虽然考虑到大多数extjs组件中使用的嵌套div /表的数量，但让它精确工作有点复杂。祝你好运！

来源

2012-11-05 17:05:20

使用ids获取引用是一个非常糟糕的主意，它会使你的widgets非常紧密地耦合 –

很难说清楚你在找什么，但是如果你想获得一个被渲染的Ext.Component的引用，你可以在HTML结构中寻找你的组件的包装器节点。 HTML ID与组件ID相同。如果您运行var comp = Ext.getCmp('some-id-12345')，并且如果返回某些内容，则会发现Ext.Component的包装。

然后，您可以使用

comp.itemId

要检索的itemId

你应该看看http://www.illuminations-for-developers.com/一种萤火虫插件，显示Ext.Components。

您还可以使用Sencha Page Analyzer看到整个组件树

来源

2012-11-05 23:03:13

将DOM元素ID追溯到其ExtJs组件

回答

相关问题