files/fr/web/api/document/ononline/index.md


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

---
title: Document.ononline
slug: Web/API/Document/ononline
tags:
  - API
  - DOM
  - Document
  - En ligne
  - Propriétés
translation_of: Web/API/Document/ononline
---
<p>{{APIRef("DOM")}}</p>

<p>Un évènement "<code>online</code>" est lancé sur le <code>&lt;body&gt;</code> (<em>corps</em>) de chaque page quand le navigateur bascule entre les modes online (<em>en ligne</em>) et offline (<em>hors ligne</em>). De plus les évènements se propagent de <code>document.body</code> vers <code>document</code> et finalement sur <code>window</code>. Les deux évènements ne sont pas annulables (vous ne pouvez pas empêcher l'utilisateur de se connecter ou de vous déconnecter).</p>

<p><code>window.navigator.onLine</code> renvoie un booléen <em>true</em> (<em>vrai</em>) si le navigateur est online et false s'il est définitivement offline (déconnecté du réseau). Les évènements online et offline sont lancés si la valeur de cet attribut change.</p>

<div class="note">
<p><strong>Note :</strong> Il est important de noter que cet événement et cet attribut sont intrinsèquement peu fiables. Un ordinateur peut être connecté à un réseau sans avoir accès à Internet.</p>
</div>

<p>Vous pouvez enregistrer les écouteurs de ces événements de plusieurs manières habituelles :</p>

<ul>
 <li>en utilisant <code><a href="/en/DOM/element.addEventListener">addEventListener</a></code> sur <code>window</code>, <code>document</code> ou <code>document.body</code></li>
 <li>en définissant les propriétés <code>.ononline</code> ou <code>.onoffline</code> sur <code>document</code> ou <code>document.body</code> sur un objet  <code>Function</code> JavaScript. (<strong>Note :</strong> l'utilisation de <code>window.ononline</code> ou <code>window.onoffline</code> ne fonctionnera pas pour des raisons de compatibilité).</li>
 <li>en spécifiant les attributs <code>ononline="..."</code> ou <code>onoffline="..."</code> sur la balise <code>&lt;body&gt;</code>  dans le balisage HTML.</li>
</ul>

<h2 id="Example">Exemple</h2>

<p>Il existe  <a href="https://bugzilla.mozilla.org/attachment.cgi?id=220609">un cas de test simple</a> que vous pouvez exécuter pour vérifier le fonctionnement des évènements.</p>

<h2 id="Example">Références</h2>

<ul>
 <li><a href="/fr/docs/Web/API/NavigatorOnLine/%C3%89v%C3%A8nements_online_et_offline">Évènements online et offline</a></li>
 <li><a href="http://www.whatwg.org/specs/web-apps/current-work/#event-online">Spécification</a> <a href="http://www.whatwg.org/specs/web-apps/current-work/#event-online">WHATWG Web App</a> (en)</li>
</ul>