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

Question

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

Uncaught NotSupportedError：无法在'Document'上执行'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

根据spec，这是不允许的。 从规格： ＆＃34;如果BASE不存在或者是自定义元素的接口，请设置ERROR 到InvalidName并停止。＆＃34;

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