zoukankan      html  css  js  c++  java
  • 学习HTML5 history API

    html5 在 history 对象上添加几个新的方法、事件、属性,用以增强开发者对于浏览器历史记录的控制。大体上说,新的API可以帮助我们在无刷新的情况下改变浏览器的url,新增或者替换之前的历史记录。建议先看看这个示例,
    具体的文档推荐参考MDN

    这里谈谈使用新的 History API时,需要特别注意的地方

    • state 保存不了完整对象,只能保存一般对象(plain object),因为可能浏览器使用了JSON方法,方法都被移除掉了。这个我是被坑过的,明明保存了对象,并且在state上面找到了,结果调用方法就报错。

    • popstate 事件在firefox下,页面直接载入时是不触发的,而 Chrome 和 Safari 下是触发的。这个问题很容易解决,因为我们总是可以通过 history.state 对象获得当前路径的 state 对象,只是在绑定事件的时候需要额外考虑一下第一次的情况(有些库会帮你考虑的)。

    • 每次浏览器历史记录发生变化都会触发popstate事件,包括用户使用前进或者后退按钮,以及调用history接口。如果历史记录是由调用pushState或者replaceState改变的,state对象可通过event对象的state属性获得。

    最后,推荐一下TJ写的page.js,一个不仅使用简单,而且对于异步操作非常友好的客户端路由库。

    (完)

  • 相关阅读:
    css选择器
    HTML标签用法
    pyenv python 版本控制
    Django之路
    Day15-Django
    python+selenium实现登录账户
    requests and BeautifulSoup
    清除MAC 可清除空间
    将python源文件打包成exe文件
    swift的一些东西
  • 原文地址:https://www.cnblogs.com/10manongit/p/12985830.html
Copyright © 2011-2022 走看看