自定义元素 v1 会在 Internet Explorer 11 上运行吗？答案

【问题标题】：will custom elements v1 ever work on internet explorer 11?自定义元素 v1 会在 Internet Explorer 11 上运行吗？
【发布时间】：2017-06-23 20:50:39
【问题描述】：

好像不行。

请注意，我指的是这里提到的自定义元素 v1：https://developers.google.com/web/fundamentals/getting-started/primers/customelements

在我的网站上，我在 javascript 控制台中看到了

SCRIPT1002: Syntax Error, NewInvite.js Line 1, Column 1

NewInvite.js 的第一行在哪里

class NewInvites extends HTMLElement

注意：我不是指“聚合物”或“网络组件”

最后，网站在 safari、移动 safari 和 chrome 上运行良好

【问题讨论】：

问微软？据我所知，他们只是在 IE 中添加安全补丁，而不是新功能。新功能改为进入 Edge。另外，你测试过 Firefox、Opera、Vivialdi 吗？
谢谢，是的，我刚刚找到了这个。看起来边缘仍在投票决定他们是否这样做？ wpdev.uservoice.com/forums/257854-internet-explorer-platform/…

标签： internet-explorer internet-explorer-11 custom-element

【解决方案1】：

如果您愿意为每个组件使用一些 polyfill 和一些额外的样板，您实际上可以在 ES5（不带类）中编写兼容 v1 的自定义元素，这些元素可以在 IE11 中使用。

基于this comment on github，您可以使用常规函数来定义您的自定义元素，然后确保在组件的构造函数中调用 Reflect.construct。

function MyEl() {
  return Reflect.construct(HTMLElement,[], this.constructor);
}

MyEl.prototype = Object.create(HTMLElement.prototype);
MyEl.prototype.constructor = MyEl;
Object.setPrototypeOf(MyEl, HTMLElement);

MyEl.prototype.connectedCallback = function() {
  console.log('my-el connected');
};
customElements.define('my-el', MyEl);
document.body.appendChild(document.createElement('my-el'));

有关完整的工作示例，请参阅 this post。

【讨论】：

【解决方案2】：

看起来答案是“否”，旨在取代“Internet Explorer”的“Edge”仍未决定，但您可以在这里投票

https://wpdev.uservoice.com/forums/257854-internet-explorer-platform/suggestions/6261318-html-imports

根据维基百科，只有 10% 的人使用 Internet Explorer，所以说“这个网站不支持 Internet Explorer”可能更容易，而不是写你的网站两次 -

https://en.m.wikipedia.org/wiki/Usage_share_of_web_browsers

【讨论】：