javascript - 如何扩展现有的自定义元素？

Question

我有一个自定义元素，称为x-foo. 我想扩展它，并创建一个x-foo-extended元素，但它不起作用。我收到此错误：

未捕获的 NotSupportedError：无法在“文档”上执行“registerElement”：类型的注册失败'x-foo-extended'。'extends' 中指定的标签名称是自定义元素名称。改为使用继承。

    var xFooExtendedProto = Object.create(xFoo.prototype);

    xFooExtendedProto.someCustomFunc = function() {
        // ...
    };

    xFooExtended = document.registerElement('x-foo-extended', {
        prototype: xFooExtendedProto,
        extends: 'x-foo'
    });

Answer 1

根据规范，这是不允许的。来自规范：“如果 BASE 不存在或者是自定义元素的接口，请将 ERROR 设置为 InvalidName 并停止。”

来源：正如在 Chrome 中实现自定义元素的人所述 https://lists.w3.org/Archives/Public/public-webapps/2014OctDec/0155.html