From 1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde Mon Sep 17 00:00:00 2001 From: julieng Date: Sat, 2 Oct 2021 17:20:24 +0200 Subject: convert content to md --- files/fr/web/api/event/eventphase/index.md | 228 +++++++++++++++-------------- 1 file changed, 118 insertions(+), 110 deletions(-) (limited to 'files/fr/web/api/event/eventphase/index.md') diff --git a/files/fr/web/api/event/eventphase/index.md b/files/fr/web/api/event/eventphase/index.md index 290a0e6659..f6721c8a8d 100644 --- a/files/fr/web/api/event/eventphase/index.md +++ b/files/fr/web/api/event/eventphase/index.md @@ -10,88 +10,114 @@ tags: - Propriétés translation_of: Web/API/Event/eventPhase --- -

{{ApiRef("DOM")}}

+{{ApiRef("DOM")}} -

Indique quelle phase du flux d'événements est actuellement évaluée.

+Indique quelle phase du flux d'événements est actuellement évaluée. -

Syntaxe

+## Syntaxe -
var phase = event.eventPhase;
-
+```js +var phase = event.eventPhase; +``` -

Retourne un entier qui spécifie la phase courante d'évaluation du flux d'événements. Les valeurs possibles sont listées dans {{anch("Constantes de phase d'événement")}}.

+Retourne un entier qui spécifie la phase courante d'évaluation du flux d'événements. Les valeurs possibles sont listées dans {{anch("Constantes de phase d'événement")}}. -

Constantes

+## Constantes -

Constantes de phase d'événement

+### Constantes de phase d'événement -

Ces valeurs décrivent quelle est la phase du flux d'événements actuellement évalué.

+Ces valeurs décrivent quelle est la phase du flux d'événements actuellement évalué. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ConstantValueDescription
Event.NONE0 -

Aucun événement n'est actuellement traité.

-
Event.CAPTURING_PHASE1 -

L'événement se propage à travers les objets ancêtres de la cible. Ce processus commence avec {{domxref("Window")}}, puis {{domxref("Document")}}, ensuite {{domxref("HTMLHtmlElement")}} et ainsi de suite à travers les éléments jusqu'à ce que le parent de la cible soit atteint. {{domxref("EventListener", "Event listeners", "", 1)}} sont enregistrés pour le mode capture lorsque {{domxref("EventTarget.addEventListener()")}} est appelé durant cette phase.

-
Event.AT_TARGET2L'événement est arrivé à {{domxref("EventTarget", "the event's target", "", 1)}}. Les écouteurs d'événements  enregistrés pour cette phase sont appelés à ce moment. Si {{domxref("Event.bubbles")}} vaut false (faux), le traitement de l'événement est terminé une fois la phase complète.
Event.BUBBLING_PHASE3L'événement se propage à rebours à travers les ancêtres de la cible dans l'ordre inverse, commençant avec le parent, et atteignant finalement le contenant {{domxref("Window")}}. Ceci est connu comme propagation et arrive seulement si {{domxref("Event.bubbles")}} vaut true (vrai). Les {{domxref("EventListener", "Event listeners", "", 1)}} enregistrés pour cette phase sont déclenchés durant ce traitement.
ConstantValueDescription
Event.NONE0

Aucun événement n'est actuellement traité.

Event.CAPTURING_PHASE1 +

+ L'événement se propage à travers les objets ancêtres de la cible. Ce + processus commence avec {{domxref("Window")}}, puis + {{domxref("Document")}}, ensuite + {{domxref("HTMLHtmlElement")}} et ainsi de suite à travers + les éléments jusqu'à ce que le parent de la cible soit atteint. + {{domxref("EventListener", "Event listeners", "", 1)}} + sont enregistrés pour le mode capture lorsque + {{domxref("EventTarget.addEventListener()")}} est + appelé durant cette phase. +

+
Event.AT_TARGET2 + L'événement est arrivé à + {{domxref("EventTarget", "the event's target", "", 1)}}. + Les écouteurs d'événements  enregistrés pour cette phase sont appelés à + ce moment. Si {{domxref("Event.bubbles")}} vaut + false (faux), le traitement de l'événement est + terminé une fois la phase complète. +
Event.BUBBLING_PHASE3 + L'événement se propage à rebours à travers les ancêtres de la cible dans + l'ordre inverse, commençant avec le parent, et atteignant finalement le + contenant {{domxref("Window")}}. Ceci est connu comme propagation + et arrive seulement si {{domxref("Event.bubbles")}} vaut + true (vrai). Les + {{domxref("EventListener", "Event listeners", "", 1)}} + enregistrés pour cette phase sont déclenchés durant ce traitement. +
-

Pour plus de détails, voir section 3.1, Event dispatch and DOM event flow (en) de la spécification du DOM niveau 3 sur les évènements .

- -

Exemple

- -

HTML

- -
<h4>Event Propagation Chain</h4>
-<ul>
-  <li>Click 'd1'</li>
-  <li>Analyse event propagation chain</li>
-  <li>Click next div and repeat the experience</li>
-  <li>Change Capturing mode</li>
-  <li>Repeat the experience</li>
-</ul>
-<input type="checkbox" id="chCapture" />
-<label for="chCapture">Use Capturing</label>
- <div id="d1">d1
-  <div id="d2">d2
-      <div id="d3">d3
-          <div id="d4">d4</div>
-      </div>
-  </div>
- </div>
- <div id="divInfo"></div>
-
- -

CSS

- -
div {
+Pour plus de détails, voir [section 3.1, Event dispatch and DOM event flow](http://www.w3.org/TR/DOM-Level-3-Events/#event-flow) (en) de la spécification du DOM niveau 3 sur les évènements .
+
+## Exemple
+
+### HTML
+
+```html
+
Event Propagation Chain

+
+
+
+ 
d1
+  
d2
+      
d3
+          
d4

+      

+  

+ 

+ 

+```
+
+### CSS
+
+```css
+div {
   margin: 20px;
   padding: 4px;
   border: thin black solid;
@@ -102,11 +128,13 @@ translation_of: Web/API/Event/eventPhase
   padding: 8px;
   background-color:white;
   font-size:80%;
-}
+} +``` -

JavaScript

+### JavaScript -
var clear = false, divInfo = null, divs = null, useCapture = false;
+```js
+var clear = false, divInfo = null, divs = null, useCapture = false;
 window.onload = function () {
   divInfo = document.getElementById("divInfo");
   divs = document.getElementsByTagName('div');
@@ -120,7 +148,7 @@ window.onload = function () {
 }
 
 function RemoveListeners() {
-  for (var i = 0; i < divs.length; i++) {
+  for (var i = 0; i < divs.length; i++) {
     var d = divs[i];
     if (d.id != "divInfo") {
       d.removeEventListener("click", OnDivClick, true);
@@ -130,7 +158,7 @@ function RemoveListeners() {
 }
 
 function AddListeners() {
-  for (var i = 0; i < divs.length; i++) {
+  for (var i = 0; i < divs.length; i++) {
     var d = divs[i];
     if (d.id != "divInfo") {
       if (chCapture.checked)
@@ -149,48 +177,28 @@ function OnDivClick(e) {
   if (e.eventPhase == 2)
     e.currentTarget.style.backgroundColor = 'red';
   var level = e.eventPhase == 0 ? "none" : e.eventPhase == 1 ? "capturing" : e.eventPhase == 2 ? "target" : e.eventPhase == 3 ? "bubbling" : "error";
-  divInfo.innerHTML += e.currentTarget.id + "; eventPhase: " + level + "<br/>";
+  divInfo.innerHTML += e.currentTarget.id + "; eventPhase: " + level + "
";
 }
 
 function Clear() {
-  for (var i = 0; i < divs.length; i++) {
+  for (var i = 0; i < divs.length; i++) {
     if (divs[i].id != "divInfo")
-      divs[i].style.backgroundColor = (i & 1) ? "#f6eedb" : "#cceeff";
+      divs[i].style.backgroundColor = (i & 1) ? "#f6eedb" : "#cceeff";
   }
   divInfo.innerHTML = '';
-}
- -

{{ EmbedLiveSample('Example', '', '700', '', 'Web/API/Event/eventPhase') }}

- -

Spécifications

+} +``` - - - - - - - - - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName("DOM WHATWG", "#dom-event-eventphase", "Event.eventPhase")}}{{Spec2("DOM WHATWG")}} 
{{SpecName("DOM4", "#dom-event-eventphase", "Event.eventPhase")}}{{Spec2("DOM4")}} 
{{SpecName("DOM2 Events", "#Events-Event-eventPhase", "Event.eventPhase")}}{{Spec2("DOM2 Events")}}Première définition
+{{ EmbedLiveSample('Example', '', '700', '', 'Web/API/Event/eventPhase') }} -

Compatibilité des navigateurs

+## Spécifications +| Spécification | Statut | Commentaire | +| ---------------------------------------------------------------------------------------------------- | -------------------------------- | ------------------- | +| {{SpecName("DOM WHATWG", "#dom-event-eventphase", "Event.eventPhase")}} | {{Spec2("DOM WHATWG")}} |   | +| {{SpecName("DOM4", "#dom-event-eventphase", "Event.eventPhase")}} | {{Spec2("DOM4")}} |   | +| {{SpecName("DOM2 Events", "#Events-Event-eventPhase", "Event.eventPhase")}} | {{Spec2("DOM2 Events")}} | Première définition | +## Compatibilité des navigateurs -

{{Compat("api.Event.eventPhase")}}

+{{Compat("api.Event.eventPhase")}} -- cgit v1.2.3-54-g00ecf