html - 按钮中的阴影 DOM

Question

有一个有效的 JS Fiddle在这里演示了Shadow DOM 。（注意：需要进行一些设置才能使其正常工作。我使用的是 Google Chrome 版本 20.0.1132.47 测试版，通过启用“Shadow DOM”实验）chrome://flags

我在这里创建了一个使用 abutton而不是a 的修订版，但span它不起作用。它抛出一个：

Uncaught Error: HIERARCHY_REQUEST_ERR: DOM Exception 3 

知道为什么可以将 Shadow DOM 添加到 aspan而不是 abutton吗？

Answer 1

这是 WebKit 中当前实现的一个限制。

在实现的早期，一个元素最多可以有一个影子根附加到它上面。由于某些元素在内部（例如视频）或计划使用（例如输入元素）使用 Shadow DOM，因此存在硬编码限制，不允许为这些元素创建作者影子根。

您可以在WebKit 错误 91486中跟踪按钮元素的作者 Shadow DOM 的实现状态。