“href”是在网站中切换页面的正确方法吗?

时间:2018-02-08 02:17:43

标签: javascript jquery ajax

所以我一直在使用老式的方式在我的网站中切换页面,我在每个页面上包含我的标题并使用/ href来转到另一个页面..我只使用ajax仅在页面内请求。不要像我说的那样将访问者切换到另一个页面,而是使用原生href的。

每次通过jquery ajax加载新页面时,我都会查看history.pushState()来更改地址栏上的url。它做得很好。问题是,当我刷新页面时,它确实保持相同的URL并再次加载该url /文件。但该文件是裸体的,没有CSS,也没有标题,因为这些只包含在我的索引中。

我虽然使用php作为我的SS。

有什么好建议吗?

1 个答案:

答案 0 :(得分:1)

使用hrefs非常好,而且标准。但是,通过ajax避免整页加载,可以获得一些性能提升。

如果想要使用pushState和ajax,则必须配置服务器,以便所有HTTP请求都能访问索引页/路由器。您可以在nginx,apache,express js或后端使用的任何内容中执行此操作。

然后在您的JS中,您想要嗅探window.location以查看用户当前所在的页面并立即触发ajax请求以加载该页面。

或者,更快但更困难的方法是将服务器设置为将所有请求指向索引,而实际上为他们请求的页面提供完整的HTML (HTML,CSS,页眉和页脚),以便页面不会回来​​"裸体"。这将使初始页面加载更快。之后,您可以在浏览网站时继续使用ajax请求。

如何执行此操作取决于您的技术堆栈。如果您像我一样使用webpack,那么至少在开发模式下,您可以将historyApiFallback: true设置为包含所有请求"后备"到你的索引,然后我使用React Router加载适当的页面。但同样,你可能会使用不同的东西。