【问题标题】:Failed to execute 'createElement' on 'Document': The result must not have children无法在“文档”上执行“createElement”:结果不能有子级
【发布时间】:2017-03-04 01:29:51
【问题描述】:

我通过polyfill 使用自定义元素v1 已经有一段时间了。 Chrome 54(第一个具有原生 v1 实现的版本)在初始化我的元素时开始抛出错误:

DOMException: 无法在“文档”上执行“createElement”:结果不能有子节点

有问题的行很简单:

let el = document.createElement('my-custom-element');

【问题讨论】:

    标签: custom-element


    【解决方案1】:

    Chrome 的原生实现似乎执行了 polyfill 没有执行的规范要求。根据规范的“Requirements for custom element constructors”部分:

    元素不得获得任何属性或子元素,因为这违背了使用 createElement 或 createElementNS 方法的消费者的期望。

    我试图创建的元素在其构造函数中为其自身添加了子元素。

    解决方案是遵循规范的建议:

    一般来说,工作应该尽可能地推迟到 connectedCallback ——尤其是涉及获取资源或渲染的工作。但是请注意,connectedCallback 可以多次调用,因此任何真正一次性的初始化工作都需要一个守卫来防止它运行两次。

    也就是说,在连接的回调中添加子元素,并使用一个标志来确保元素只在第一次连接时被初始化。

    【讨论】:

      猜你喜欢
      • 2017-06-02
      • 2019-06-15
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-11-17
      • 1970-01-01
      • 2023-03-23
      相关资源
      最近更新 更多