recursal/MDN huggingface dataset:
TreeWalker.filter
=================

La propriété en lecture seule **`TreeWalker.filter`** renvoie un `NodeFilter` (*filtre de noeuds*) qui est l'objet de filtrage associé à `TreeWalker`.

Lors de la création du `TreeWalker`, l'objet filtre est transmis comme 3ème paramètre et sa méthode `NodeFilter.acceptNode()` est appelée sur tous les noeuds pour déterminer s'il doit ou non l'accepter.

Syntaxe
-------


```js
nodeFilter = treeWalker.filter;
```

Exemple
-------


```js
var treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode: function (node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
  false,
);
nodeFilter = treeWalker.filter; // document.body dans ce cas
```

Spécifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-filter |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* L'interface `TreeWalker` à laquelle elle appartient.
TreeWalker.previousSibling()
============================

La méthode **`TreeWalker.previousSibling()`** déplace le `Node` courant vers son frère précédent, le cas échéant, et renvoie le frère trouvé. S'il n'y en a pas, elle renvoie `null` et le noeud actuel est inchangé.

Syntaxe
-------


```js
node = treeWalker.previousSibling();
```

Exemple
-------


```js
var treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW\_ELEMENT,
  {
    acceptNode: function (node) {
      return NodeFilter.FILTER\_ACCEPT;
    },
  },
  false,
);
var node = treeWalker.previousSibling(); // renvoie null car il n'y a pas de frère précédent
```

Spécifications
--------------

| Specification |
| --- |
| DOM Standard # dom-treewalker-previoussibling |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* L'interface `TreeWalker` à laquelle elle appartient.
Clipboard.write()
=================

La methode **`write()`** de `Clipboard` écrie des données arbitraire, comme des images, vers le presse-papier. Elle peut être utilisé pour implémenter une fonctionalité de copier coller.

Avant de pouvoir écrire dans le presse-papier, vous devez utiliser Permissions API pour avoir l'autorisation `"clipboard-write"`.

**Note :** Les API Presse-papiers (*clipboard*) asynchrones sont toujours en cours d'implémentation. Consultez le tableau de compatibilité et la section Disponibilité du presse-papiers sur la page `Clipboard` pour plus d'informations.

Syntaxe
-------


```js
var promise = navigator.clipboard.write(dataTransfer);
```

### Paramètres

`dataTransfer`

Un objet `DataTransfer` contenant les données à écrire dans le presse-papier.

### Return value

Une `Promise` qui sera résolut quand les données seront écrite dans le presse papier. Cette promesse est rejetée si l'accés au presse-papier échoue.

Exemple
-------

Cette fonction d'exemple remplace l'actuel contenu du presse-papier par le texte spécifié en paramètre.


```js
function setClipboard(text) {
  let data = new DataTransfer();

  data.items.add(text, "text/plain");
  navigator.clipboard.write(data).then(
    function () {
      /\* success \*/
    },
    function () {
      /\* failure \*/
    },
  );
}
```


Le code commence par la creation d'un nouveau objet `DataTransfer` dans lequel le texte est placé pour être envoyé au presse-papier. `DataTransferItemList.add()` (en-US) est appelé pour ajouté le texte à `DataTransfer`, ensuite `write()` est appelé, en spécifiant une function d'accomplissement et une fonction d'erreur.

Spécifications
--------------

| Specification |
| --- |
| Clipboard API and events # dom-clipboard-write |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
Clipboard.writeText()
=====================

La méthode **`writeText()`** de l'interface `Clipboard` écrit le texte spécifié dans le presse-papiers du système.

**Note :** La spécification requiert que l'API Permissions soit utilisée pour obtenir la permission `"clipboardWrite"` avant d'écrire dans le presse-papiers. Cependant, les prérequis exacts varient de navigateur en navigateur, car c'est une API récente. Consultez la table de compatibilité et la section Disponibilité du presse-papiers sur la page `Clipboard` pour plus de détails.

Syntaxe
-------


```js
var promesse = navigator.clipboard.writeText(nouveauTexte);
```

### Paramètres

`nouveauTexte`

La `DOMString` devant être écrite dans le presse-papiers.

### Valeur de retour

Une `Promise` qui sera résolue une fois que le contenu du presse-papiers aura été mis à jour. La promesse est rejetée si le code appelant n'a pas la permission d'écrire dans le presse-papiers.

Exemple
-------

Cet exemple définit le contenu du presse-papiers comme la chaîne "<presse-papiers vide>".


```js
navigator.clipboard.writeText("<presse-papiers vide>").then(
  function () {
    /\* presse-papiers modifié avec succès \*/
  },
  function () {
    /\* échec de l’écriture dans le presse-papiers \*/
  },
);
```

Spécifications
--------------

| Specification |
| --- |
| Clipboard API and events # dom-clipboard-writetext |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLLinkElement.as
==================

La propriété **`as`** de l'interface `HTMLLinkElement` (en-US) renvoie une chaîne représentant le type de contenu chargé par le lien HTML, parmi `"script"`, `"style"`, `"image"`, `"video"`, `"audio"`, `"track"`, `"font"`, `"fetch"`.

Valeur
------

Une chaîne de caractères.

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # dom-link-as |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
ExtendableMessageEvent.origin
=============================

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La propriété en lecture seule **origin** de l'interface `ExtendableMessageEvent` retourne l'origine du `ServiceWorkerClient` (en-US) qui a envoyé le message.

Syntaxe
-------


```js
var myOrigin = ExtendableMessageEventInstance.origin;
```

### Value

Une `DOMString`.

Exemples
--------

Le code suivant est utilisé, dans un service worker, pour répondre à un message push en envoyant les données reçues par le `PushMessageData` (en-US) au contexte principale, via le canal de messages (en-US). L'objet événement de `onmessage` sera un `ExtendableMessageEvent.`


```js
var port;

self.addEventListener("push", function (e) {
  var obj = e.data.json();

  if (obj.action === "subscribe" || obj.action === "unsubscribe") {
    port.postMessage(obj);
  } else if (obj.action === "init" || obj.action === "chatMsg") {
    port.postMessage(obj);
  }
});

self.onmessage = function (e) {
  console.log(e.origin);
  port = e.ports[0];
};
```

Spécifications
--------------

| Specification |
| --- |
| Service Workers # extendablemessage-event-origin |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Utilisation des Service Workers (en-US)
* Exemple simple des service workers
* Est-ce que les service workers sont prêts ?
* Canal de messages (en-US)
ExtendableMessageEvent.ports
============================

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La propriété en lecture seule **ports** de l'interface `ExtendableMessageEvent` retourne un tableau contenant les objects `MessagePort` (en-US) représentants les ports associés aux canaux de messages associés (le canal du message est envoyé).

Syntaxe
-------


```js
var myPorts = ExtendableMessageEventInstance.ports;
```

### Value

Un tableau de `MessagePort` (en-US).

Exemples
--------

Le code suivant est utilisé, dans un service worker, pour répondre à un message push en envoyant les données reçues par le `PushMessageData` (en-US) au contexte principale, via le canal de messages (en-US). L'objet événement de `onmessage` sera un `ExtendableMessageEvent.`


```js
var port;

self.addEventListener("push", function (e) {
  var obj = e.data.json();

  if (obj.action === "subscribe" || obj.action === "unsubscribe") {
    port.postMessage(obj);
  } else if (obj.action === "init" || obj.action === "chatMsg") {
    port.postMessage(obj);
  }
});

self.onmessage = function (e) {
  port = e.ports[0];
};
```

Spécifications
--------------

| Specification |
| --- |
| Service Workers # extendablemessage-event-ports |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Utilisation des Service Workers (en-US)
* Exemple simple des service workers
* Est-ce que les service workers sont prêts ?
* Canal de messages (en-US)
ExtendableMessageEvent.ExtendableMessageEvent()
===============================================

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

Le constructeur **`Extendable.MessageEvent()`** crée une nouvelle instance d'un `ExtendableMessageEvent`.

Syntaxe
-------


```js
var myEME = new ExtendableMessageEvent(type, init);
```

### Paramètres

type

Un `DOMString` qui définie le type de message créé.

init Facultatif

Un objet d'initialisation, qui doit contenir les paramètres suivant:

* `data`: Les données de l'évènement — peut être de n'importe quel type.
* `origin`: Une `DOMString` qui définie l'origine de l'environnement du service worker correspondant.
* `lastEventId`: Une `DOMString` qui définie le dernier l'id du dernier évènement de l'évènement source.
* `source`: Le `Client`, `ServiceWorker` ou `MessagePort` (en-US) qui a envoyé un message.
* `ports`: Un tableau contenant les objets `MessagePort` (en-US) connectés au canal d'envoie des messages.

Exemples
--------


```js
var init = {
  data: "Message de bienvenue",
  source: MessagePortReference,
  ports: MessagePortListReference,
};

var myEME = new ExtendableMessageEvent("message", init);
```

Spécifications
--------------

| Specification |
| --- |
| Service Workers # dom-extendablemessageevent-extendablemessageevent |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Utiliser les Service Workers (en-US)
* Exemple simple de service workers
* Les Services Workers sont-ils prêts ?
* Canal de messages (en-US)
ExtendableMessageEvent.data
===========================

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La propriété **`data`** est une propriété en lecture seule rattachée à l'interface `ExtendableMessageEvent` et qui permet d'accéder aux données de l'évènement. Il peut s'agir de n'importe quel type de donnée.

Syntaxe
-------


```js
var mesDonnees = ExtendableMessageEventInstance.data;
```

### Valeur

N'importe quel type de donnée.

Exemples
--------

Quand le code suivant est utilisé dans un service worker pour répondre à un message *push* en envoyant les données reçues par `PushMessageData` (en-US) au contexte principal via un message (en-US), l'objet de l'évènement `onmessage` sera un `ExtendableMessageEvent`.


```js
var port;

self.addEventListener("push", function (e) {
  var obj = e.data.json();

  if (obj.action === "subscribe" || obj.action === "unsubscribe") {
    port.postMessage(obj);
  } else if (obj.action === "init" || obj.action === "chatMsg") {
    port.postMessage(obj);
  }
});

self.onmessage = function (e) {
  console.log(e.data);
  port = e.ports[0];
};
```

Spécifications
--------------

| Specification |
| --- |
| Service Workers # extendablemessage-event-data |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Utiliser les *Service Workers*
* Exemple simple utilisant les *service workers*
* État d'avancement de l'implémentation pour *ServiceWorker* dans les navigateurs
* Échange de messages entre les canaux (en-US)
ExtendableMessageEvent.lastEventId
==================================

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La propriété en lecture seule **`lastEventID`** de l'interface `ExtendableMessageEvent` représente, dans les évenements envoyés par lle serveur, le dernier ID de l'évenement source.

Syntaxe
-------


```js
var myLastEventId = ExtendableMessageEventInstance.lastEventId;
```

### Value

Une `DOMString`.

Exemples
--------

Le code suivant est utilisé, dans un service worker, pour répondre à un message push en envoyant les données reçues par le `PushMessageData` (en-US) au contexte principale, via le canal de messages (en-US). L'objet événement de `onmessage` sera un `ExtendableMessageEvent.`


```js
var port;

self.addEventListener("push", function (e) {
  var obj = e.data.json();

  if (obj.action === "subscribe" || obj.action === "unsubscribe") {
    port.postMessage(obj);
  } else if (obj.action === "init" || obj.action === "chatMsg") {
    port.postMessage(obj);
  }
});

self.onmessage = function (e) {
  console.log(e.lastEventId);
  port = e.ports[0];
};
```

Spécifications
--------------

| Specification |
| --- |
| Service Workers # extendablemessage-event-lasteventid |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Utilisation des Service Workers (en-US)
* Exemple simple des service workers
* Est-ce que les service workers sont prêts ?
* Canal de messages (en-US)
HTMLInputElement.checkValidity()
================================

Baseline 2023
-------------

Newly availableSince March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
La méthode **`HTMLInputElement.checkValidity()`** renvoie une valeur booléenne qui indique la validité de la valeur de l'élément. Si la valeur n'est pas valide, cette méthode déclenche également l'évènement `invalid` (en-US) sur l'élément.

Syntaxe
-------


```js
checkValidity();
```

### Paramètres

Aucun.

### Valeur de retour

Renvoie `true` si la valeur de l'élément n'a pas de problèmes de validité ; sinon renvoie `false`.

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # dom-cva-checkvalidity-dev |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* En apprendre plus : Validation des données de formulaires côté client
* Guide : Validation des contraintes (en-US)
* API de validation de contraintes (en-US)
HTMLInputElement.labels
=======================

La propriété en lecture seule **`HTMLInputElement.labels`** renvoie une `NodeList` (*liste de noeuds*) des éléments `<label>` (*étiquette*) associés avec l'élément `<input>` (*entrée*).

Syntaxe
-------


```js
var labelElements = input.labels;
```

### Valeur retournée

Une `NodeList` contenant les éléments `<label>` associés avec l'élément `<input>`.

Exemple
-------

### HTML


```html
<label id="label1" for="test">Label 1</label>
<input id="test" />
<label id="label2" for="test">Label 2</label>
```

### JavaScript


```js
window.addEventListener("DOMContentLoaded", function () {
  const input = document.getElementById("test");
  for (var i = 0; i < input.labels.length; i++) {
    console.log(input.labels[i].textContent); // "Label 1" et "Label 2"
  }
});
```

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # dom-lfe-labels-dev |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
select
======

L'évènement `select` est déclenché quand du texte est sélectionné. L'évènement peut ne pas être disponible pour tous les éléments dans tous les langages. Par exemple, en HTML5, les évènements select ne peuvent être envoyés que sur des éléments `input` de formulaire et `textarea`.

Info générale
-------------

Spécification

DOM L3

Interface

UIEvent si généré depuis une interface utilisateur, Event sinon.

Remonte

Oui

Annulable

Non

Cible

Élément

Action par Défault

Aucune

Propriétés
----------

| Property | Type | Description |
| --- | --- | --- |
| `target` Lecture seule  | `EventTarget` | The event target (the topmost target in the DOM tree). |
| `type` Lecture seule  | `DOMString` | The type of event. |
| `bubbles` Lecture seule  | `Boolean` (en-US) | Whether the event normally bubbles or not. |
| `cancelable` Lecture seule  | `Boolean` (en-US) | Whether the event is cancellable or not. |
| `view` Lecture seule  | `WindowProxy` | `document.defaultView` (`window` of the document) |
| `detail` Lecture seule  | `long` (`float`) | 0. |

Exemple
-------


```html
<input id="test" type="text" value="Sélectionnez-moi !" />
<script>
 var elem = document.getElementById("test");
 elem.addEventListener(
 "select",
 function () {
 alert("La sélection a changé !");
 },
 false,
 );
</script>
```
BlobEvent.BlobEvent()
=====================

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

Le constructeur **`BlobEvent()`** renvoie un nouvel objet `BlobEvent` créé avec un `Blob` associé.

Syntaxe
-------


```js
blobEvent = new BlobEvent({data: aSpecificBlob}[, timecode]);
```

### Arguments

*Le constructeur `BlobEvent()`* *hérite des arguments de `Event()`.*

`data`

est un `Blob` associé à l'évènement.

`timecode` Facultatif

un `DOMHighResTimeStamp` à utiliser pour initialiser l'événement blob.

Spécifications
--------------

| Specification |
| --- |
| MediaStream Recording # dom-blobevent-blobevent |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* L'interface `BlobEvent` à laquelle il appartient.
BlobEvent.data
==============

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La propriété en lecture seule **`BlobEvent.data`** représente un `Blob` associé à l'évènement.

Syntaxe
-------


```js
associatedBlob = BlobEvent.data;
```

Spécifications
--------------

| Specification |
| --- |
| MediaStream Recording # dom-blobevent-data |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* L'interface `BlobEvent` à laquelle elle appartient.
PerformanceObserverEntryList.getEntriesByType()
===============================================

La méthode **`getEntriesByType()`** de la `PerformanceObserverEntryList` retourne une liste d'objets d'entrée de performance explicitement *observés* pour un type d'entrée de performance. Les membres de la liste sont déterminés par l'ensemble des types d'entrées spécifiés dans l'appel à la méthode `observe()`. La liste est disponible dans la fonction de rappel de l'observateur (en tant que premier paramètre de la fonction de rappel).

**Note :** Cette interface est exposée à `Window` et `Worker`.

Syntaxe
-------


```js
let entries = list.getEntriesByType(type);
```

### Paramètres

*`type`*

Le type d'entrée à récupérer, tel que « `frame` ». Les types d'entrée valides sont énumérés dans `PerformanceEntry.entryType`.

### Valeur de retour

Une liste d'objets `PerformanceEntry` explicitement *observés* qui ont le `type` spécifié. Les éléments seront dans l'ordre chronologique basé sur les `startTime` des entrées. Si aucun objet n'a le `type` spécifié, ou si aucun argument n'est fourni, une liste vide est retournée.

Exemple
-------


```js
function print\_perf\_entry(pe) {
  console.log(
    "name: " +
      pe.name +
      "; entryType: " +
      pe.entryType +
      "; startTime: " +
      pe.startTime +
      "; duration: " +
      pe.duration,
  );
}

// Crée un observateur pour tous les types d'événements de performance
const observe_all = new PerformanceObserver(function (list, obs) {
  let perfEntries;

  // Imprime toutes les entrées
  perfEntries = list.getEntries();
  for (let i = 0; i < perfEntries.length; i++) {
    print\_perf\_entry(perfEntries[i]);
  }

  // Imprime les entrées nommées "Begin" avec le type "mark".
  perfEntries = list.getEntriesByName("Begin", "mark");
  for (let i = 0; i < perfEntries.length; i++) {
    print\_perf\_entry(perfEntries[i]);
  }

  // Imprime les entrées de type "mark".
  perfEntries = list.getEntriesByType("mark");
  for (let i = 0; i < perfEntries.length; i++) {
    print\_perf\_entry(perfEntries[i]);
  }
});
// inscrire tous les types d'événements de performance
observe_all.observe({
  entryTypes: ["frame", "mark", "measure", "navigation", "resource", "server"],
});

const observe_frame = new PerformanceObserver(function (list, obs) {
  let perfEntries = list.getEntries();
  // Ne devrait avoir que des entrées "frame"
  for (let i = 0; i < perfEntries.length; i++) {
    print\_perf\_entry(perfEntries[i]);
  }
});
// inscrire à l'événement "frame" uniquement
observe_frame.observe({ entryTypes: ["frame"] });
```

Spécifications
--------------

| Specification |
| --- |
| Performance Timeline # dom-performanceobserverentrylist-getentriesbytype |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.