Window: Propiedad customElements

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since enero de 2020.

La propiedad de solo lectura customElements de la interfaz Window, devuelve una referencia al objeto CustomElementRegistry, el cual puede usarse para registrar un nuevo elemento personalizado y obtener información sobre el elemento previamente registrado.

Ejemplos

El ejemplo mas común que verás de esta propiedad es para acceder al método CustomElementRegistry.define() para definir y registrar un nuevo elemento personalizado, por ejemplo:

js
let customElementRegistry = window.customElements;
customElementRegistry.define("my-custom-element", MyCustomElement);

Sin embargo, generalmente se acorta como se muestra a continuación:

js
customElements.define(
  "element-details",
  class extends HTMLElement {
    constructor() {
      super();
      const template = document.getElementById(
        "element-details-template",
      ).content;
      const shadowRoot = this.attachShadow({ mode: "open" }).appendChild(
        template.cloneNode(true),
      );
    }
  },
);

Consulta nuestro repositorio web-components-examples para obtener mas ejemplos.