Hay muchos ejemplos de cómo guardar el estado de la pestaña con jQuery pero no con Vanilla JS: quiero recordar el estado de la última pestaña en caso de que un usuario abandone y regrese a la página, actualice la página, etc. ¿Sería mejor una variable de sesiones o almacenamiento local? la mejor opción ?
<html> <head> <meta charset="utf-8"> <style> .red { background:red; color:#fff; } </style> </head> <body> <div class="container"> <div class="bar blue"> <button class="bar-item button tablink red" onclick="openTab(event,'Summary')">Summary</button> <button class="bar-item button tablink" onclick="openTab(event,'Finance')">Finance</button> <button class="bar-item button tablink" onclick="openTab(event,'Enquire')">Enquire</button> <button class="bar-item button tablink" onclick="openTab(event,'Save')">Save</button> </div> <div id="Summary" class="container border vehTab"> FIRST TAB </div> <div id="Finance" class="container border vehTab" style="display:none"> SECOND TAB </div> <div id="Enquire" class="container border vehTab" style="display:none"> THIRD TAB </div> <div id="Save" class="container border vehTab" style="display:none"> FOURTH TAB </div> </div> <script> function openTab(evt, tabName) { var i, x, tablinks; x = document.getElementsByClassName("vehTab"); for (i = 0; i < x.length; i++) { x[i].style.display = "none"; } tablinks = document.getElementsByClassName("tablink"); for (i = 0; i < x.length; i++) { tablinks[i].className = tablinks[i].className.replace("red", ""); } document.getElementById(tabName).style.display = "block"; evt.currentTarget.className += " red"; } </script> </body> </html>Las sesiones se destruyen una vez que el usuario cierra la pestaña o el navegador. Sugeriría almacenamiento local sobre almacenamiento de sesión en su caso
El almacenamiento en sesión se destruirá cuando el usuario cierre la pestaña o el navegador.
El almacenamiento en el almacenamiento local estará presente durante toda la vida hasta que lo borre. Si está utilizando almacenamiento local en páginas seguras (el usuario que inició sesión solo tiene acceso a él), sugiero que se borre cuando el usuario cierre la sesión