Comment utiliser JavaScript pour implémenter la fonction back

JavaScript est un langage de script couramment utilisé dans le développement d'applications Web et de sites Web. Dans ce processus, les fonctionnalités de l'interface utilisateur sont cruciales, parmi lesquelles la fonctionnalité du bouton « retour ». L'objet historique est fourni en HTML5, qui peut facilement implémenter les fonctions d'avant et d'avant. Cet article explique comment implémenter la fonction back à l'aide de JavaScript.

1. Utilisez la méthode history.back()

history.back() est utilisée pour accéder à l'enregistrement précédent dans l'historique d'accès de l'utilisateur. Par exemple, lorsque les utilisateurs utilisent la fonction de recherche, ils peuvent cliquer sur quelques liens et souhaiter ensuite revenir à la page précédente pour apporter des modifications. Dans ce cas, vous pouvez utiliser la méthode history.back().

Voici comment l'utiliser :

history.back();

Cela vous ramènera à la page précédente. Si la page initialement visitée par l’utilisateur était une page de résultats de recherche, la page précédant la recherche sera renvoyée. En effet, l'objet historique stocke l'historique des accès de l'utilisateur.

2. Utilisez history.go()

La méthode history.go() peut également être utilisée pour accéder à la page précédente, mais la différence avec history.back() est que vous pouvez spécifier combien de fois renvoyer les enregistrements. . Par exemple, si l'utilisateur souhaite revenir à la troisième page consultée précédemment, il peut utiliser le code suivant :

history.go(-2);

Cela renverra la troisième page la plus récente. Si un utilisateur tente de revenir à trois pages alors qu'il visite moins de trois pages, l'enregistrement le plus ancien sera renvoyé.

3. Utilisez window.location.href

Une autre méthode consiste à utiliser l'objet location pour revenir à la page précédente. Utilisez la propriété window.location.href pour obtenir l'URL de la page actuelle, puis redirigez-la vers l'URL de la page précédente. Un exemple de code pour cette approche est le suivant :

window.location.href = document.referrer;

Utilisez la propriété document.referrer pour obtenir l'URL de la page précédente, puis redirigez window.location.href vers la page précédente.

Résumé

Les trois méthodes ci-dessus peuvent vous aider à implémenter la fonction du bouton « retour » dans les applications et sites Web JavaScript. Utilisez l’une de ces méthodes pour revenir facilement à l’historique de l’utilisateur et améliorer l’expérience utilisateur.

Cependant, il est important de noter que si votre site Web ou votre application utilise une architecture d'application monopage (SPA), vous devrez peut-être utiliser la fonctionnalité de routeur d'un framework front-end pour implémenter des fonctionnalités de va-et-vient, telles que Vue Router. ou React Router. En effet, dans SPA, le changement de page est géré via le routeur frontal, et non via l'historique du navigateur.

Lors de la mise en œuvre d'un bouton Retour, gardez l'expérience utilisateur à l'esprit et assurez-vous que la méthode de mise en œuvre répond aux besoins de votre application ou de votre site Web.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!