Web开发:如何在浏览器中“存储”页面并防止每次在它们之间导航时重新加载它们

问题描述 投票:0回答:1

我是Web开发的新手,正在使用纯JS创建Web应用程序。我将Firebase和Express.js路由用于后端功能。这是一种简单的博客服务,因此页面之间自然会有很多导航。

当前问题:每当用户在页面之间来回移动时,即使没有任何更改,页面也会每次刷新。这是2020年至关重要的用户体验问题。我想这是因为我正在为每个URL请求发送一个html文件,但不知道解决方法是什么。

问题:如何确保呈现的页面“存储”在用户的浏览器中,并且仅在内容发生有意义的更改时才重新加载?

不好意思,只是在3个月前提出了编程要求。 :)将不胜感激,从哪里开始寻找任何方向性的建议。

javascript node.js express routing navigation
1个回答
0
投票

因此,这是JS框架将帮助您制作SPA应用程序的地方。基本上,当用户首先单击您的应用程序,然后动态显示/隐藏不同的页面以避免页面刷新时,将加载所有页面。

您可以使用JavaScript手动将css类添加/删除到不同的页面元素,如下所示>>

.hidden {
    display: none;
}

<div class="hidden">
    ...page 1 (not shown)
</div>
<div>
    ...page 2 (shown)
</div>
<div class="hidden"
    ...page 3 (not shown)
</div>

这是一个轻量级且简单的解决方案,但请记住,这不会更改url。我认为大多数SPA JS框架都会在其中使用#标签来执行“ example.com/#/contact”或“ example.com/#/about”之类的操作,因此url可以帮助用户查看其所在页面。希望对您有所帮助!

© www.soinside.com 2019 - 2024. All rights reserved.