Javascript 自定义元素适用于Safari，但不适用于Firefox和Chrome_Javascript_Google Chrome_Firefox_Web Component_Custom Element

Javascript 自定义元素适用于Safari，但不适用于Firefox和Chrome

javascript google-chrome firefox

Javascript 自定义元素适用于Safari，但不适用于Firefox和Chrome,javascript,google-chrome,firefox,web-component,custom-element,Javascript,Google Chrome,Firefox,Web Component,Custom Element,我确信我在规范中遗漏了一些基本的东西，但是在运行Safari的Mac上构建了大量自定义元素之后，我发现它们在Firefox和Chrome上不起作用。我错过了什么 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>NoCE</title> <script> class

我确信我在规范中遗漏了一些基本的东西，但是在运行Safari的Mac上构建了大量自定义元素之后，我发现它们在Firefox和Chrome上不起作用。我错过了什么

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>NoCE</title>
        <script>
            class NoCE extends HTMLElement {
                constructor(args) {
                    super();
                }

                connectedCallback() {
                    this.innerHTML = "<p>It Works</p>";
                }

                attributeChangedCallback(name, oldValue, newValue, namespaceURI) {}

                disconnectedCallback() {}

                adoptedCallback() {}

                static get observedAttributes() { return []; }
            }

            customElements.define("no-ce", NoCE, { extends: "div" });
        </script>
    </head>
    <body>
        <no-ce>
            No custom elements
        </no-ce>
    </body>
</html>

在Safari中，页面显示它可以工作。在Firefox和Chrome中，它没有显示在Mac OS X上运行的自定义元素

Safari 12.0.2 Firefox 64.0.2

Chrome 71.0.3578.98

您将自治自定义元素（又称新HTML标记）的定义与自定义内置元素（又称标准HTML元素扩展）的定义混为一谈，后者的语法略有不同

对于自治自定义元素：

未实现自治自定义元素

自定义内置元素未实现您将自治自定义元素（又名新HTML标记）的定义与自定义内置元素（又名标准HTML元素扩展）的定义弄混了，后者的语法略有不同

对于自治自定义元素：

未实现自治自定义元素

自定义内置元素未实现我看到删除{extends:div}有帮助，但随后我失去了div继承。我看到删除{extends:div}有帮助，但随后我失去了div继承。太好了。谢谢，太好了。非常感谢。

class NoCE extends HTMLElement
...
customElements.define( 'no-ce', NoCE )
...
<no-ce><no-ce>

class NoCE extends HTMLDivElement
...
customElements.define( 'no-ce', NoCE, { extends: 'div'} )
...
<div is='no-ce'></div>