javascript - 在 GWT 中按属性获取 DOM 元素？

Question

我想将 GWT 中的元素添加到静态 html 页面的以下元素中：

<div data-id="test"></div>

当我会使用这个时：

<div id="test"></div>

那么我可以通过以下方式访问该元素：

RootPanel.get("test").add(someElement);

这仅在我使用 id 属性时才有效。

如何访问使用像第一个示例中所示的 data-id 之类的属性的元素并在其上附加面板或小部件？

Answer 1

如果您不需要支持 IE6/7，那么您可以使用 JSNI：

Element querySelector(String selectors) /*-{
  return $doc.querySelector(selectors);
}-*/;

查看http://caniuse.com/queryselector以获取兼容表。

也许 GWT 3.0 会将其添加到 GWT 中，因为 IE6/7 支持肯定会被删除（它仅在 GWT 2.6 中默认禁用）

既然你得到了Element，不幸的是没有RootPanel.get(Element)方法，所以你可以获得一个可以添加其他小部件的面板小部件的唯一方法是使用HTMLPanel.wrap(Element).

Answer 2

使用gwtquery，您可以像这样匹配元素：

$("div[data-id='test']").add(someElement);