Javascript 如何将html设置为extjs中的元素
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14745691/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to set html to a element in extjs
提问by Mr_Green
1)How to set HTMLto already created panel or any other Element?
1)如何设置HTML为已经创建的面板或任何其他元素?
I am a beginner. I tried the below to set some content inside the HTML
我是初学者。我尝试了以下在 HTML 中设置一些内容
var clickedElement = Ext.getCmp('id').el.child('>');
clickedElement.setHTML("hello");
The above is working fine but the problem is that as the panel has many div's inside it.. the above approach is erasing those inside html (i.e div's) and replacing it with the above content.
以上工作正常,但问题是面板内部有很多 div ..上述方法是擦除 html 中的那些(即 div)并将其替换为上述内容。
I saw through Chrome that the panel has three nested div's. So, if I want to add HTML to it then I need to give something like below:
我通过 Chrome 看到面板有三个嵌套的 div。所以,如果我想向其中添加 HTML,那么我需要提供如下内容:
var clickedElement = Ext.getCmp('id').el.child('>').child('>'); //two times child
When I tried the above approach, I am successfully adding the html content and also the div's doesn't remove. Here the problem is that, I can't see the added content (maybe because of some default stylings, I can see the content is being added in Chrome console though.)
当我尝试上述方法时,我成功添加了 html 内容,并且 div 也没有删除。这里的问题是,我看不到添加的内容(可能是因为某些默认样式,我可以看到内容正在 Chrome 控制台中添加。)
I am just asking whether there is any efficient way of adding HTML to the panel. In my opinion, this should be very easy approach which I am complexing here.
我只是问是否有任何有效的方法将 HTML 添加到面板。在我看来,这应该是我在这里复杂化的非常简单的方法。
2)How to check whether a Element has a particular child ?
2)如何检查一个元素是否有一个特定的孩子?
Suppose, for example, If I added a extjs Buttonas a child(item) into my panel while creating it. (which I can do). How to check whether the panel has the particular element (i.e button here)?
例如,假设extjs Button我在创建面板时将 a作为子项(项目)添加到面板中。(我可以做到)。如何检查面板是否具有特定元素(即此处的按钮)?
Before asking here, I searched alot and found somewhat relative but not helpful linkto my problem.
在问这里之前,我搜索了很多,发现了一些与我的问题相关但没有帮助的链接。
回答by sra
In ExtJS most components are considered to have only one body element even if you see more on the dom. In contrast to jQuery which is basically added above a markup ExtJS generate the whole markup by itself.
在 ExtJS 中,大多数组件被认为只有一个 body 元素,即使你在 dom 上看到更多。与基本上添加在标记之上的 jQuery 相比,ExtJS 自己生成整个标记。
Now to your question, to update the HTML of a component you can simply call the update()method like that
现在回答您的问题,要更新组件的 HTML,您可以简单地调用这样的update()方法
Ext.getCmp('id').update('hello');
See JSFiddle
回答by code4jhon
Ext.ComponentQuery.query('#itemIdOfComponent').update('new value');
Do not set id's on components instead add an itemId configuration and see the documentation for Ext.ComponentQuery.query.
不要在组件上设置 id,而是添加 itemId 配置并查看 Ext.ComponentQuery.query 的文档。

