JSFiddle - React, Tailwind, and code Playground

JavaScript

function _parseQueryString( queryString ) {
       var pairs = queryString.split('&');
       var params = {};
       for(var i=0; i<pairs.length; ++i ) {
           var parts = pairs[i].split('=');
           if( parts.length == 0 ) continue;
         var name = parts.shift();
         var value = '';
         while(parts.length) {
           value += parts.shift();
         }
           params[name]=value;
       }
       return params;
     }

     function _buildQueryString( params ) {
       var queryString = "";
       for( var i in params ) {
         if( queryString.length > 0 ) queryString += "&";
         queryString += (i + '=' +params[i]);
       }
       return queryString;
      }
      
    function set_part(queryString, key, value) {
      /* first remove the leading '#/', if any */
        if( queryString.indexOf('#')==0 ) {
           queryString = queryString.substring(1);
        }
        if( queryString.indexOf('/')==0 ) {
           queryString = queryString.substring(1);
        }


      /* now parse the hash (in queryString format) into 
        an object containing all the parts */
      var params = _parseQueryString(queryString);

      /* finally, just set the value in the params object, 
         and rebuild the query string, adding 
        in the slash again 
      */
      params[key]=value;
      window.location.hash = '/' + _buildQueryString(params);
    }
    
    /* set hash for testing */
  window.location.hash='/var1=blablabla&var2=var2text&gghh=edere';
    alert( 'hash before '+window.location.hash );
    
    /* now change hash and alert... to see if it worked */
    set_part( window.location.hash, 'var2', 'bar');
    set_part( window.location.hash, 'foo', 'foovalue');
        
    alert( 'hash after '+window.location.hash );