javascript – document.registerElement – 为什么我们需要同时指定’prototype’和’extends’？

考虑我想扩展本机按钮元素,并创建我自己的超级按钮元素.据我所知,它必须遵循以下模式：

var SuperButton = document.registerElement('super-button', {
  prototype: Object.create(HTMLButtonElement.prototype),
  extends: 'button'
});

它看起来很奇怪 – 原型和扩展参数不是说同样的事情吗？如果我明确说我的超级按钮使用HTMLButtonElement原型,为什么我还需要指定它扩展button元素？这不是多余的吗？对我来说,它看起来完全相同的信息.

解决方法:

从Custom Elements specification：

In general, the name of the element being extended cannot be determined simply by looking at what element interface it extends, as many elements share the same interface (such as q and blockquote both sharing HTMLQuoteElement).

换句话说,虽然它可能是多余的< button>元素,一般来说并不多余,规范需要支持一般情况.

我认为它对于< button>来说甚至不是多余的.但是,因为没有什么可以阻止你这样做：

var SuperButton = document.registerElement('super-button', {
  prototype: Object.create(HTMLButtonElement.prototype),
  extends: 'a'
});

标签：javascript,html5,web-component,custom-element
来源： https://codeday.me/bug/20190611/1219971.html