如何在GWT中获取嵌套div

我希望在GWT中获得一个嵌套的div，并能够在其中放置一个小部件。大概是这样的：

<div id="container">
    <div id="content_left">
    </div>
    ...other divs
</div>

…其他部门

我希望能够得到内容_左，并把一个小部件在那里。到目前为止，RootPanel得到的都是标记中的div。我还尝试使用DOM.getElementById（…），但我不知道如何放置小部件，因为add方法指定输入参数应为child类型

现在我对CSS和定位不太了解，我没有做上面的样式设计。这是我从我的平面设计师那里得到的东西。我想这是他安排事情的方式。

---

我已经在考虑在布局时不必使用外部div，比如上面id=container的div，这样我就不会有这个问题，但我想听听这是不是个好主意

GWT为这类事情提供了容器小部件：它们为您生成div，您可以根据自己的规则将它们嵌套到任何深度。您实际上不需要为任何事情使用显式div

你说

现在我对CSS和定位不太了解，我没有做上面的样式设计

---

这正是GWT的目的：你不需要这样做。您将GUI放在代码中，让GWT担心如何将其转换为CSS。提示：这比我们大多数人做得都好。许多已知的浏览器怪癖都有解决办法，可以使其尽可能跨平台。

您提供的HTML代码片段的具体示例如下。FlowPanel是支持向其添加任意数量内容的div。如果您知道给定的div中只有一个小部件，那么SimplePanel可能是更好的选择

不管怎样，通常您要做的是获取要生成的HTML并构建GWT代码以输出特定的DOM结构。下面是一篇关于我如何处理更简单的小部件的文章

---

如果您的设计师正在生成高质量的布局代码，您应该使用它，但前提是您知道所有风险和兼容性问题，并且不关心或有能力测试您的布局

假设所有这些，我发现这种方法非常有效

只需从HTMLPanel构建小部件并使用div，当您需要编程控制时，只需切换到第一类对象来表示您的布局

内容

请注意，您仍然可以将模糊样式与香草div/span等一起使用，或者混合搭配

您可以将html更改（或告诉设计师更改）为

<div id="container">
    <div id="content_left">
        <span id="qq"/>
    </div>
    ...other divs
</div>

欢迎来到UIBinder

支持自定义HTML+小部件

---

“让用户界面设计师更容易与他们合作，他们对XML、HTML和CSS比Java源代码更熟悉”

但是网页的现有设计在很大程度上依赖于他的嵌套div。我应该告诉他重新编码网页，将静态部分与我打算使用GWT的部分分开吗？GWT有一个最重要的内容根：没有在不同的地方进行GWT的概念。也许其他人有不同的观点，但我不认为有办法让你当前的设计与GWT很好地配合。我的意思是设计，图形。它们到处都是我想要放置GWT小部件的地方。在本例中，它们也位于id为的div容器中。现在你是说我也应该在GWT中布局我的图形，比如使用HTML小部件，或者通过CSS使用setStylePrimaryName我认为我们没有很好地沟通，也就是说，可能会错过对方的观点，我担心我可能会给你不好的建议。我很抱歉，但我认为最好是我退出这个问题。GWT生成糟糕的表格布局，如果你想要一个好看的应用程序，它不会削减它。但如果兼容性和覆盖范围是关键，而不是外观，那么就值得考虑。只是说有很多次它不起作用是的，我以前想过，但我有一个问题，GWT模块加载比整个网页/其静态部分稍晚一点，特别是我正在做一个RPC调用。谢谢伙计！你的回答给我省去了很多麻烦！

    <g:HTMLPanel >

            <div class="normal style classes {obfuscated.style.class}">
                    <g:FlowPanel ui:field="programmaticPanel" stylePrimaryName="style">
                            <g:HTMLPanel>
                                    <p>CONTENT</p>
                            </g:HTMLPanel>
                    </g:FlowPanel>
            </div>

    </g:HTMLPanel >

<div id="container">
    <div id="content_left">
        <span id="qq"/>
    </div>
    ...other divs
</div>

FlowPanel panel = new FlowPanel();
RootPanel.get("qq").add(panel);
panel.add(w1);
panel.add(w2);
...