javascript - 了解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.创 build 置样式...但是有时并没有必要，并且将HTML作为字符串附加起来可以更快，更好地读取。

是什么原因导致内联样式在清理后被删除？我可以按此处所述制作自己的NodeTreeSanitizer:appendHtml() doesn't append the full HTML - Dart

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

我使用了ÜberSimple Webapp模板，并添加了以下代码:

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

而且样式刚刚删除:

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

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

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

非常感谢!

编辑:

SVG元素也被删除:

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

最佳答案

创建自定义NodeTreeSanitizer是一种方法。应用HTML卫生后，可以将文本添加到DOM的任何地方。卫生并未用.appenedHTML()进行只是一个疏忽。关键是要明确声明可以将哪些元素添加到DOM中以及可以将哪些属性添加到这些元素中。这样做是为了确保不会将恶意HTML或JS错误地添加到页面。