Native js achieve access to operating parameters by monitoring the URL

Native js achieve access to the user's operation by monitoring the operation of the URL information

When optimizing your site, because the list is rendered with vue cycle components, there have been a problem, click the jump problem, like a lot of programs, use js function of the way the face of this situation is not optimistic, think OJ schools # is used with additional parameters, we found a bit bigwigs blog, carried out a complete monitoring URL jump.
The main points are these:

1. Attached to each article of a button, in essence, link label binding parameters with articles about the numbers,

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

2. Parameters are added listener is captured, a page jump, the additional parameters in the Get parameter type, operation to another page
3. URL of the site to be divided # separator, the separator is then = the division of each section, and then traverse to find the character id, fetches the next value

code show as below

//监听触发操作
       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);
       }