我从来没有使用过HTML5的onpopstate/pushState方法。但是,我正在构建(或已经构建)一个网站,其中滚动页面会将地址栏中的散列更改为视口中当前显示的元素的ID。所以我在我的单页面布局上有一种浏览器历史记录和深度链接。
我仍然通过设置top.location.hash
和使用hashchange()
函数来执行此操作。现在,我遇到了这个新的HTML5 popstate/onPushstate方法,并认为这将是有趣的…
首先:使用这种popstate/onPushState
方法的好处是什么?使用这种方法比使用top.location.hash
的经典方法更好吗?性能更好吗?
如果是这样,有没有办法查询或找出当前浏览器是否支持这种方法?因此,我可以在现代浏览器中使用这些方法,并在较旧的浏览器中采用旧方法。
这有可能吗?如果是,那么是如何实现的?
发布于 2012-01-08 17:01:07
您可以使用html5历史api执行更多操作。
您可以替换历史记录中的当前项,也可以创建一个新项。使用标签解决方案,您只能添加新的标签。
当您创建或替换历史记录条目时,您还可以更改url并传递一个javascript对象,该对象将在popstate中返回给您,该对象可以包含任何数据。
一个很好的例子就是github (http://www.github.com)。在开始时,他们只发送一次完整的页面,之后他们会更改页面和url,以匹配您在初始请求时加载的新页面。(这意味着刷新的效果非常好)
如果你想测试历史支持,你可以这样做:
if (history && history.pushState)
发布于 2012-01-08 16:59:43
使用这个popstate/onPushState方法有什么好处?
你得到的真正的URL并不依赖于JavaScript来运行。
如果支持,有没有办法查询或找出当前浏览器是否支持此方法?
if (history && history.pushState)
…或者只使用a compatibility library
https://stackoverflow.com/questions/8776353
复制相似问题