Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.

View in English Always switch to English

NavigateEvent : méthode scroll()

Baseline 2026
Nouvellement disponible

Depuis janvier 2026, cette fonctionnalité fonctionne sur les appareils et les versions de navigateur les plus récents. Elle peut ne pas fonctionner sur les appareils ou navigateurs plus anciens.

La méthode scroll() de l'interface NavigateEvent peut être appelée pour déclencher manuellement le comportement de défilement piloté par le navigateur qui se produit en réponse à la navigation, si vous souhaitez qu'il se produise avant que le traitement de la navigation ne soit terminé.

Syntaxe

js
scroll()

Paramètres

Aucun.

Valeur de retour

Aucun (undefined).

Exceptions

InvalidStateError DOMException

Levée si l'objet Document actuel n'est pas encore actif, ou si la navigation a été annulée.

SecurityError DOMException

Levée si l'évènement a été déclenché par un appel à dispatchEvent(), plutôt que par l'agent utilisateur.

Exemples

Gérer le défilement avec scroll()

Dans cet exemple d'interception d'une navigation, la fonction handler() commence par récupérer et rendre le contenu d'un article, puis récupère et rend ensuite un contenu secondaire. Il est logique de faire défiler la page jusqu'au contenu principal de l'article dès qu'il est disponible afin que l'utilisateur·ice puisse interagir avec lui, plutôt que d'attendre que le contenu secondaire soit également rendu. Pour ce faire, nous avons ajouté un appel à scroll() entre les deux.

js
navigation.addEventListener("navigate", (event) => {
  if (shouldNotIntercept(navigateEvent)) {
    return;
  }
  const url = new URL(event.destination.url);

  if (url.pathname.startsWith("/articles/")) {
    event.intercept({
      async handler() {
        const contenuArticle = await obtenirContenuArticle(url.pathname);
        rendrePageArticle(contenuArticle);

        event.scroll();

        const contenuSecondaire = await obtenirContenuSecondaire(url.pathname);
        ajouterContenuSecondaire(contenuSecondaire);
      },
    });
  }
});

Spécifications

Spécification
HTML
# dom-navigateevent-scroll-dev

Compatibilité des navigateurs

Voir aussi