怎样具体实现无刷新跳转页面？

Question

我现在在用Laravel开发一个网站后台，页面主要由三部分组成：顶部导航栏id="headnav"、侧边导航栏id="headnav"和主要内容id="content"。
我想要实现那种在左侧导航栏点击某个链接之后，整个页面不用刷新来加载，只是content区域和地址栏地址、标题栏的内容变化，请问如何实现？
我在网上查找了很多介绍ajax实现的方法，但是都有点太简略，我的JavaScript基础不好，不是很能看懂，想请教一下大家，谢谢。

Answer 1

你的想法以前也有人想过的, 然后 pjax 就出来了

Answer 2

涉及到地址修改，不推荐你不适用前端路由(框架)的情况下这么做。

1. 地址修改可以用html5标准的

   history.pushState('state//一个状态对象', '测试//标题', 'test//资源路径')
   // 比如在https://www.baidu.com/下执行后地址就变成
   //https://www.baidu.com/test/

   但是你需要自己处理用户点击浏览器返回的业务逻辑。

2. 标题修改就是document.title = '你的值'

3. content可以用这么几种方式

   • display切换
   • iframe
   • js动态创建和删除所有的content内页面结构

所以页面结构上也用不着ajax，ajax用来取局部数据更合适