网站建设网页之间转换过度
网站建设网页之间转换过度正确的方式，正确的方式在页面之间创建简单的交叉淡入淡出过渡所涉及的步骤。它涉及一些叫做pushStateAJAX（或PJAX）导航的东西，它实质上将我们的网站变成一种单页网站。这种技术不仅可以实现平滑和愉快的过渡，而且我们将从其他优势中受益。
防止默认链接行为
第一步是click为所有要使用的链接创建一个事件侦听器，防止浏览器执行其默认行为并自定义处理页面更改的方式。这种将事件监听器添加到父元素而不是将其添加到每个特定节点的方法称为事件委托，并且由于HTML DOM API 的事件冒泡性质，这种方法也是可能的。
获取页面
现在尝试更改页面时中断了浏览器，可以使用Fetch API手动获取该页面。看看下面的函数，该函数在给定URL时获取页面的HTML内容。对于不支持Fetch API的浏览器，请考虑添加polyfill或使用老式的XMLHttpRequest。
更改当前URL
HTML5有一个很棒的API pushState，允许网站访问和修改浏览器的历史记录，而无需加载任何页面。下面使用它将当前URL修改为下一页的URL。请注意，这是我们之前声明的锚点击事件处理程序的修改。
请注意添加了名为changePage函数的调用，在popstate事件中也会调用相同的函数，当浏览器的活动历史记录条目发生更改时（例如，当用户单击其浏览器的后退按钮时）会触发该函数：window.addEventListener('popstate', changePage);
有了这一切基本上构建了一个非常原始的路由系统，其中我们有主动和被动模式。我们的活动模式在用户点击链接时使用pushState，我们使用更改URL ，而当URL发生变化时，我们会通过popstate事件通知被动模式。无论哪种情况，我们调用changePage，负责阅读新网址并加载相关页面。
网站制作解析并添加新内容
通常，导航的页面将具有共同的元素，例如header和footer，假设我们在所有页面上使用以下DOM结构（实际上是Smashing Magazine本身的结构）
