var arr = 'tag.class1.class2.class3#id'.split(/\.|#/);
var str = `<${arr[0]} class="${arr[1]} ${arr[2]} ${arr[3]} id="${arr[4]}"></${arr[0]}>`;
alert(str);

var str = "tag.class1.class2.class3#id"
function fn(str) {
  var tag = "div", match, div = document.createElement("div"), elem;
  if (match = str.match(/^[^.#]+/)) {
    tag = match[0];
  }
  elem = document.createElement(tag);
  if (match = str.match(/#([^.#]+)/g)) {
    elem.id = match[0].slice(1);
  }
  if (match = str.match(/\.([^.#]+)/g)) {
    match.forEach(function(cls) {
      elem.classList.add(cls.slice(1));
    });
  }
  div.appendChild(elem);
  return div.innerHTML;
};
alert(fn(str))

var str = 'div.class1#id.class2.class3';
var elem = { 'tag': '',  'class':'', 'id':''};
var flag = 'tag';
for (var i = 0; i < str.length; i++) {
     if(str[i] == '.') { flag = 'class'; elem[flag] += " "; i++ }
     if(str[i] == '#') { flag = 'id'; i++ }
     elem[flag] += str[i];
}
alert(JSON.stringify(elem));