如何将html设置为extjs中的元素 [英] How to set html to a element in extjs

问题描述

1）如何将 HTML 设置为已创建的面板或任何其他元素？

我是初学者我尝试下面在HTML中设置一些内容

  var clickedElement = Ext.getCmp（'id'）。el.child （ '>'）; 
 clickedElement.setHTML（hello）; 
  

上面的工作正常，但问题是，面板里面有很多div。以上方法正在擦除html（即div）中的内容，并将其替换为上述内容。

我通过Chrome看到该面板有三个嵌套的div。所以，如果我想添加HTML，那么我需要给出如下的东西：

  var clickedElement = Ext.getCmp 'ID'）el.child（ '>'）子（ '>'）; //两次孩子
  

当我尝试上述方法时，我成功添加了HTML内容， div不会删除。这里的问题是，我看不到添加的内容（可能是因为一些默认样式，我可以看到内容正在添加到Chrome控制台。）

我只是问是否有任何有效的方式向面板添加HTML。在我看来，这应该是非常简单的方法，我在这里很复杂。

2）如何检查元素是否有特定的孩子？假设，例如，如果我在创建时将我作为一个小孩（项目）添加了一个 extjs Button 到我的面板中它。 （我可以做）如何检查面板是否具有特定的元素（即按钮在这里）？

在询问这里之前，我搜索了很多，发现有些相对而且没有帮助链接我的问题。

解决方案

即使您在dom上看到更多，ExtJS大多数组件也被认为只有一个主体元素。与基本上添加在标记上的jQuery相反，ExtJS自身生成了整个标记。

现在就您的问题，更新您可以简单地调用的组件的HTML

  Ext.getCmp（'id）的 update（） '）.update（' 你好'）; 
  

请参阅 JSFiddle

1) How to set HTML to already created panel or any other Element?

I am a beginner. I tried the below to set some content inside the 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.

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:

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.)

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.

2) How to check whether a Element has a particular child ?

Suppose, for example, If I added a extjs Button as 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)?

Before asking here, I searched alot and found somewhat relative but not helpful link to my problem.

解决方案

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.

Now to your question, to update the HTML of a component you can simply call the update() method like that

Ext.getCmp('id').update('hello');

See JSFiddle

这篇关于如何将html设置为extjs中的元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！