document.registerElement - 为什么我们需要同时指定'prototype'和'extends'？ [英] document.registerElement - Why do we need to specify both 'prototype' and 'extends'?

问题描述

考虑我想扩展原生的按钮元素，并创建我自己的超级按钮元素。据我所知，它必须遵循以下模式：

Consider I want to extend the native button element, and create my own super-button element. As I know, it must follow the following pattern:

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

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

It looks strange to me - doesn't the prototype and extends parameters say the same thing? If I explicitly say that my super-button use the HTMLButtonElement prototype, why do I also need to specify that it extends the button element? isn't it redundant? For me it looks like exactly the same information.

推荐答案

来自自定义元素规范：

通常，扩展元素的名称不能简单地通过查看它扩展的元素接口来确定，因为许多元素共享相同的接口（例如q和blockquote都共享HTMLQuoteElement）。

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> 元素可能是多余的，但一般来说并不多余而规范需要支持一般情况。

In other words, while it may be redundant for <button> elements, it isn't redundant in general and the spec needs to support the general case.

我认为，对于< button> 来说，它甚至不是多余的，因为没有任何阻止你这样做：

I would argue that it isn't even redundant for <button> though, as there is nothing preventing you from doing:

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

这篇关于document.registerElement - 为什么我们需要同时指定'prototype'和'extends'？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！