如何使用javascript RegExp end replace或其他方法从子div创建具有数据属性的div包装器？

有一个带有html的字符串：

<div data-class="wrapper-class" data-id="wrapper-id" id="hello-world"> 
    <div data-id="superid" data-class="superclass" class="title">My Title</div data-class data-id> 
    <div class="description">My Desription</div>
</div data-id data-class>
<div data-id="mr-jack" id="mr-brown">Hey!</div data-id>

我的头衔
我的描述
嘿

对于具有数据属性的标记，需要使用这些数据属性创建div包装器，而不使用“前缀”数据-

有一个结果字符串示例：

<div class="wrapper-class" id="wrapper-id">
    <div id="hello-world">
        <div id="superid" class="superclass">
            <div class="title">My Title</div>
        </div>
        <div class="description">My Description</div>
    </div>
</div>
<div id="mr-jack">
    <div id="mr-brown">Hey!</div>
</div>

我的头衔
我的描述
嘿

我可以使用javascript RegExp end replace来完成它吗，还是以其他方式？

---

非常感谢

您可以使用此功能执行此操作：

function wrapAndCleanUpElement(el) {
  var wrapper = document.createElement('div')

  for (var data in el.dataset) {
    var dataValue = el.dataset[data]
    switch (data) {
      case 'id':
        wrapper.id = dataValue
        break
      case 'class':
        wrapper.className = dataValue
        break
    }

    el.removeAttribute('data-' + data)
  }

  el.parentElement.insertBefore(wrapper, el)
  wrapper.appendChild(el)
}

建议程序员谨慎行事