了解 Dart 1.11 的新appendHTML清理

我刚刚升级到 Dart 1.11，我不太明白发生了什么.appendHTML()。我有一个非常大的项目，使用 dart 和.appendHTML()经常使用。我已经在这个应用程序上工作了一年多了，但现在没有任何效果了。 :/

我的控制台看起来像这样：

Removing disallowed attribute <DIV style="width: 100%; text-align: right;">
Removing disallowed attribute <DIV style="height: 2em;">
Removing disallowed attribute <DIV style="height: 0.6em;">
Removing disallowed attribute <DIV style="height: 2em;">
Removing disallowed attribute <DIV style="height: 1em;">
Removing disallowed attribute <DIV style="text-align: justify;">
Removing disallowed attribute <DIV style="height: 1em;">
Removing disallowed attribute <DIV style="height: 0.6em;">
Removing disallowed attribute <SPAN style="color: #0d4b63; font-size: 1.6em;">

大多数时候我使用创建元素new Element()和设置样式使用.style....但有时这是没有必要的，将 HTML 作为字符串附加只是更快、更好阅读。

内联样式在清理时被删除的原因是什么？我可以自己做NodeTreeSanitizer正如这里提到的：appendHtml() 不会附加完整的 HTML - Dart

但这对我来说似乎不是一个很好的解决方案，因为我想这种情况发生是有原因的。

我使用了 Über Simple Webapp 模板，只是添加了这行代码：

querySelector('#output').appendHtml('<div style="height: 2em; background: red;">Test</div>');

并且样式刚刚被删除：

Removing disallowed attribute <DIV style="height: 2em; background: red;">

但对我来说它确实看起来像有效的 HTML。 :/

有人可以向我解释一下这里发生了什么以及为什么以及如何让我的项目再次运行。

多谢！

EDIT:

svg 元素也被删除：

Removing disallowed element <g>
Removing disallowed element <text>
Removing disallowed element <image>
Removing disallowed element <polygon>

创建您的定制NodeTreeSanitizer是要走的路。在应用 HTML 清理时可以将文本添加到 DOM 的任何地方。这只是一个疏忽，没有做好卫生工作.appenedHTML()。要点是您显式声明哪些元素可以添加到 DOM 以及哪些属性可以添加到这些元素。这样做是为了确保不会错误地将恶意 HTML 或 JS 添加到页面中。