自定义元素/ WebComponents是否可以与SVG一起使用？

Question

对于CustomElements，我可以这样做：

class MyElement extends HTMLElement {}

我可以对SVG Elements做同样的事情吗？喜欢

class MyOwnRectangle extends SVGRectElement {}

如果可行，我可以麻烦别人使用jsbin吗？

如果没有，为什么不呢？

这有一些很好的用例，例如能够将模型数据存储在元素本身中。SVG 操作基本上用于两个主要领域：

1. 动画制作
2. 诸如ER，组织结构图，流程等图。

诸如JointJS之类的库以类的形式（扩展了Backbone视图）具有自己的抽象，以存储与视图（屏幕上的SVG图）关联的模型数据。

就像WebComponents最终可以以标准方式替代Framework X的jQuery插件一样，为什么不对SVG这样做呢？

最后，

Polymer 0.5如何做到这一点？

Polymer.js是否支持内部SVG元素？

此修补程序如何在Polymer 1.0中做到这一点？

https://github.com/Polymer/polymer/pull/3372

现在有什么替代方案？

我想我们可以扩展HTMLElement。在我们ShadowDOM使用的<svg>元素，然后附上所有我们其实是想延长，如SVG标签<rect>，<polyline>等等！也许更干净的方法呢？

将来会实施吗？

Answer 1

根据规格

\n

\n

如果 result\xe2\x80\x99s 命名空间不是 HTML 命名空间，则抛出 NotSupportedError。

\n

\n

所有 SVG 元素都位于 SVG 命名空间中。因此该规范排除了支持。

\n

在 SVG 中存储数据的方式包括<metadata> 标签和data- 属性。

\n