Recharger une page

**eleydet** · 31/03/2019, 09h02

Bonjour,

Ma question a dû être abordée maintes fois, veuillez m'en excuser.

Si j'ouvre ma page avec n'importe lequel des deux codes ci-dessous, le résultat est le même : La première case est cochée.
Par contre, si je coche la deuxième case et que je recharge la page (exemple : appui sur le bouton F5 du clavier) :
- Avec le premier code la deuxième case reste cochée.
- Avec le deuxième code, la première case redevient cochée.

Pourquoi?

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <input type="radio" name="o" checked>Choix 1<br>
    <input type="radio" name="o">Choix 2<br>
    <input type="radio" name="o">Choix 3<br>
  </body>
</html>

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <input type="radio" name="o">Choix 1<br>
    <input type="radio" name="o">Choix 2<br>
    <input type="radio" name="o">Choix 3<br>
    <script>document.getElementsByTagName("input")[0].checked=true;</script>
  </body>
</html>

**Watilin** · 31/03/2019, 19h29

Le navigateur garde en mémoire « l’état » d’une page à court terme, tant que son onglet reste ouvert. Mon hypothèse est que c’est lié au concept de session de navigation comme décrit dans la doc de sessionStorage (mais c’est à vérifier).

L’état inital des champs de formulaire, défini par les attributs checked, value, etc. ne vaut que pour le premier chargement de la page. Lorsque tu recharges la page (ou restaures l’onglet, par exemple avec Ctrl+maj+T), le navigateur repositionne les champs à l’état qu’ils avaient avant le rechargement. Ça se produit au moment où la représentation DOM de l’élément est construite, donc avant l’évènement DOMContentLoaded.

Dans ton exemple 2, le script se trouve à la fin du <body>, il est donc appelé après la construction des champs de formulaire. Donc, le cochage de l’input 0 se fait après que le navigateur ait restauré l’ancien état des champs.

**eleydet** · 31/03/2019, 20h59

Bonsoir,

Je pensais ma question plutôt simple... En fait non. Comprendre comment fonctionne un navigateur n'est pas si évident.

Un appui sur la touche F5 du clavier ou un clic sur l'icône "recharger la page" recharge la page, mais en tenant compte de données enregistrées temporairement dans le navigateur. La page est donc partiellement rechargée. On la recharge complètement en associant les touches ctrl et F5 du clavier.

Recharger une page

JavaScript

Vue hybride

Discussions similaires

Partager

Partager