gwt - 如何在没有 DIV (GWT) 的情况下添加 HTML

Question

我正在尝试动态创建菜单（使用数据库中的一些数据），当我尝试使用 gwt HTML 复合或 HTMLPanel 添加新菜单项“li”时会出现问题，li 添加在 div 元素中！这打破了我的风格并打破了菜单，如何在 gwt 中添加没有 div 的 html？

<ul style="display: none;" id="agence-id" class="submenu">      
<div class="gwt-HTML">
<li>
<a id="P45O421">  
<i class="icon-double-angle-right">
</i>P45O421</a>
</li>
</div>
<div class="gwt-HTML">
<li>
<a id="c2">  
<i class="icon-double-angle-right">
</i>c2
</a>
</li>
</div>
<div class="gwt-HTML">
<li>
<a id="c3">   
<i class="icon-double-angle-right"></i>c3</a>
</li>
</div>
<div class="gwt-HTML">
<li>
<a id="c4">   
<i class="icon-double-angle-right">
</i>c4</a>
</li>
</div>

Answer 1

Create the HTMLPanel with the constructor where you can set the tag: HTMLPanel("li", yourHTML);. This will use the li instead of the standard div.

Answer 2

您可以使用 dete Document.get().createLIElement() 方法创建 Li 元素，然后将它们添加到您的 ul 元素中。当你调用 RootPanel.get("YOURID").you 得到 ul 元素，因为你给它一个 id 并且因此可以在 DOM 中找到它：

代码示例：

import com.google.gwt.dom.client.Document;
import com.google.gwt.dom.client.LIElement;

...

HeadingElement liElement = Document.get().createLIElement();
liElement.setInnerText("This is a Li(l1) element!");
RootPanel.get("agence-id").getElement().appendChild(liElement );