Polymer 优雅地降解自定义元素（或聚合物元素）

许多开发人员一直在想，在定制元素（或聚合物元素）中应该如何实现优雅的降解。这适用于未使用polyfills、不支持Web组件或仅关闭JavaScript的用例

---

有没有人想到应该怎么做？

我认为这是合理的。这就是大多数（并非所有）HTML元素的工作方式。查看过去的这篇文章：

有两种类型的自定义元素，我们通常对添加对优雅降级的支持感兴趣：扩展本机HTML标记的自定义元素和不扩展本机HTML标记的自定义元素

自定义元素支持以本机方式扩展已烘焙到平台中的元素（例如

，

）。一种方法是使用

is

语法。因此，如果您要扩展内置的，我认为确保优雅降级的最直接方法是使用

is

语法，如下所示：

而不是

以下是一些我能看到这一点的例子：

输入字段：

<input is="fancy-input" type="text" value="So fancy">

如果不支持自定义元素的浏览器将标记解释为

htmlunknowneelement

，则仍将呈现回退（加载消息）。这（似乎）适用于简单元素

对于更复杂的元素（例如，如果您在元素中使用

/

），我会在升级自定义元素时通过脚本删除回退

<video is="custom-player" src="amazeballs.mp4">

<audio is="music-visualizer" src="track.ogg">

<my-preload-animation>
  Loading...
</my-preload-animation>