【JavaScript】新浪微博ajax请求后改变地址栏url，但页面不跳转的方案解析

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

新浪微博当你弹出一个视频的时候再点下一页时，原视频还在，而且地址栏的url的页数变了。
对于这种网上讨论最多的方案有以下几种：
一、通过锚点Hash实现
在这方面其实国内很早就有做了，比如淘宝画报，通过的是在地址栏后面加#锚点实现的，浏览器是可以识别锚点为单位的历史记录的。但不
是说页面本身有这个锚点，锚点的Hash只是起到一个引导浏览器将这次的记录推入历史记录栈顶的作用。
二、通过HTML5加强型的History对象实现(类Pjax)
可以通过window.history.pushState这个方法无刷新的更新浏览器地址栏，这个方法在更新地址栏的同时将地址压入历史记录堆栈里，而要
取出这个栈顶页面则可以用popstate这个事件来捕获。
另外这里要推荐一个jQuery组件叫pjax（https://github.com/defunkt/jquery-pjax），比较牛叉的一个组件，异步的部分load进来另外一个页面对应容器中的内容，实现的机理和我上面的第二种方案一致。pushState + ajax = pjax 感觉这个应用会热起来的。
稍微总结下，两种方案其实对于想IE6或者FF3.6等比较低级的浏览器支持不是很好，前者若要兼容低端浏览器要用轮询来监听浏览器地址栏行为，而后者的话是完全的HTML5应用，对于非HTML5浏览器只能做判断跳转了。
如pjax最后的一段无奈的兼容处理：
Js代码
$.support.pjax = window.history && window.history.pushState
    // Fall back to normalcy for older browsers.
    if ( !$.support.pjax ) {
      $.pjax = function( options ) {
        window.location = $.isFunction(options.url) ? options.url() : options.url
      }
      $.fn.pjax = function() { return this }
    }