原生的js操作实现通过对URL的监控获取参数

原生的js操作实现通过对URL的监控获取用户的操作信息

优化网站的时候，因为列表是用vue组件进行循环渲染，就出现了一个问题，单击跳转的问题，想了很多方案，使用js函数的方式面对这种情况并不乐观，想到学校OJ用的就是用#附加参数，搜了一下大佬们博客，搞了一个监控URL完成跳转。

主要是这些点：

1. 给每一个文章附加一个按钮，实质是链接标签，绑定一下参数与文章号，

<a v-bind:href="'#id='+psgmsg.blogId" class="btn btn-primary">Have a look</a>

1. 添加的参数被监听器捕获，进行页面跳转，参数附加在Get类型的参数中，交给另一个页面操作
2. 对网站的URL进行#为分隔符的划分，然后对每个部分用=为分隔符的划分，然后遍历找到id字符，取出下一个值

代码如下

//监听触发操作

       function hashChange(){

           var query = window.location.href;

           var vars = query.split("#");

           for (var i=0;i<vars.length;i++) {

               var pair = vars[i].split("=");

               if(pair[0] == "id"){

                   window.location="./blog.html?id="+pair[1];

               }

           }

       }

//url变化监听器

       if( ('onhashchange' in window) && ((typeof document.documentMode==='undefined') || document.documentMode==8)) {

           // 浏览器支持onhashchange事件

           window.onhashchange = hashChange;  // TODO，对应新的hash执行的操作函数

       } else {

           // 不支持则用定时器检测的办法

           setInterval(function() {

               // 检测hash值或其中某一段是否更改的函数， 在低版本的iE浏览器中通过window.location.hash取出的指和其它的浏览器不同，要注意

               var ischanged = isHashChanged();

               if(ischanged) {

                   hashChange();  // TODO，对应新的hash执行的操作函数

               }

           }, 150);

       }