La propriété name de l'interface HTMLSlotElement retourne ou définit le nom de l'emplacement. Un emplacement est un espace réservé à l'intérieur d'un composant web que les utilisateur·ice·s peuvent remplir avec leur propre balisage.

Valeur

Une chaîne de caractères.

Exemples

L'extrait suivant est tiré de notre exemple de slotchange ^(angl.) (voir en direct ^(angl.)).

let slots = this.shadowRoot.querySelectorAll("slot");
slots[1].addEventListener("slotchange", (e) => {
  let nodes = slots[1].assignedNodes();
  console.log(
    `L'élément dans l'emplacement "${slots[1].name}" a changé pour "${nodes[0].outerHTML}".`,
  );
});

Ici, nous récupérons les références de tous les emplacements, puis nous ajoutons un gestionnaire d'évènement slotchange au deuxième emplacement du modèle — c'est celui dont le contenu change dans l'exemple.

Chaque fois que l'élément inséré dans l'emplacement change, nous enregistrons un rapport dans la console indiquant quel emplacement a changé et quel est le nouveau nœud à l'intérieur de l'emplacement.

Spécifications

Compatibilité des navigateurs