Window.customElements

La propriété en lecture seule customElements de l'interface Window renvoie une référence à l'objet CustomElementRegistry, qui peut être utilisée pour enregistrer de nouveaux éléments personnalisés et obtenir des informations sur des éléments personnalisés enregistrés.

let registreElementsPersonnalises = window.customElements;

Une instance d'objet CustomElementRegistry représentant le registre des éléments personnalisés pour la fenêtre en cours.

L'exemple le plus courant d'utilisation de cette propriété que vous verrez sera d'obtenir l'accès à la méthode CustomElementRegistry.define() pour définir et enregistrer un nouvel élément personnalisé, par exemple :

let registreElementsPersonnalises = window.customElements;
registreElementsPersonnalises.define('mon-element-personnalise', MonElementPersonnalise);

Cependant, il est généralement raccourci en quelque chose comme :

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

Voir notre repo web-components-examples pour davantage d'exemples d'utilisation.