Question

我继承了许多传统的GWT代码，可以简洁地描述为“Web开发人员最糟糕的噩梦”。开发人员使用了许多具有内联样式的元素 - 例如，GWT DeckPanel。

我想删除这些内联样式，以便我可以应用外部样式表，但我似乎无法找到任何方法来执行此操作。我知道可以通过以下方式设置内联样式：DOM.setStyleAttribute(container1, "height", "100%");或类似，但似乎没有任何类型的相应removeStyleAttribute。有一个DOM.removeElementAttribute，但这不适用于样式。

有没有办法从属性中明确删除所有内联样式？我尝试使用Google搜索，但我最终找到的是与UIBinder相关的内容以及来自GWT的大量防御性帖子“为什么你想这样做吗？“我不能做太多的代码修改，因为这个应用程序是庞大的，我在截止日期。我们没有使用UIBinder。

Answer 1

设置内联CSS样式，如下所示：

Style style = widget.getElement().getStyle();
style.setPosition(Position.ABSOLUTE);
style.setTop(50, Unit.PX);
style.setLeft(0, Unit.PX);
// etc.

删除样式：

style.clearPosition();
style.clearTop();
style.clearLeft();

可替换地：

DOM.setStyleAttribute(element, "height", "");

删除元素的所有内联样式：

DOM.setElementProperty(element, "style", "");

您还可以通过将!important附加到样式定义来覆盖具有外部样式的内联样式。 E.g。

.my-gwt-widget {
    height: 150px !important;
}

Answer 2

如果要清除元素的样式，可以使用以下代码：

DOM.setElementProperty(element, "style", "");

从GWT元素中删除内联样式属性

2 个答案: