改变的问题是＆＃39;在Polymer中动态

Question

我正在尝试将Polymer UI添加到包含表单的现有HTML页面。我无法控制页面内容，只能控制页眉和页脚，因此我无法更改表单以使用Polymer元素而不是<input>。因此，我试图使用Javascript重写表单。

我发现在现有元素中添加is属性没有效果 - 该元素没有被提升。

我认为这一切都发生在Polymer扫描DOM寻找is属性之后，因此它没有注意到我的更改。 （虽然创建一个具有is属性的新元素并添加它也不起作用，这有点奇怪，因为添加一个Polymer自定义元素会工作。）

有没有办法解决这个问题;例如，当我添加新元素时告诉Polymer以便可以正确升级它？

Answer 1

要使用is=，您必须扩展本机元素。这些被称为类型扩展自定义元素（http://www.html5rocks.com/en/tutorials/webcomponents/customelements/#usetypeextension）。

一般情况下，我不认为稍后添加is=属性会对升级元素产生任何影响。该元素需要使用is=（例如<input is="core-input">）预先声明，或使用特殊版本的createElement动态实例化：

var input = document.createElement('input', 'core-input');

在声明的情况下，这是解析器发出信号以改变元素的原型。在JS案例中，这是在创建时完成的。如果您只使用el.setAttribute('is', 'core-input')，那么元素的原型已经由该点创建，因此它没有效果。