Как составить регулярное выражение на вынос тегов с data-* в div-обертку?

Question

[ZaxapKramer]

Имеется строка с html вида:

<div data-class="hello" data-id="world" id="hello"> 
	<div data-id="superid" data-class="superclass" class="title></div data-class data-id> 
	<div class="description"></div>
</div data-id data-class>
<div data-id="block" id="hello"></div data-id>

Необходимо получить нечто подобное:

<div class="hello" id="world">
	<div id="hello">
		<div id="superid" class="superclass">
			<div class="title"></div>
		</div>
		<div class="description"></div>
	</div>
</div>
<div id="block">
	<div id="hello"></div>
</div>

В регулярках не спец, но весь день потратил в надежде что-то с этим сделать... Помогите, пожалуйста! Заранее спасибо.

Comments

[OVK2015]

Из примера не совсем понятно как вы разбиваете. В простейшем случае:

var testStr = '<div data-class="hello" id="hello"></div>'
testStr.replace(/(.*?)(?:data-(.*?)(?:=")(.*?)")(.*?)$/i, '<div $2="$3">\n$1$4\n</div>')

[ZaxapKramer]

OVK2015, в результате вокруг тегов с data-аттрибутами создается div-обертка с этими самыми аттрибутами (data-*), но без префикса "data-".

[OVK2015]

ZaxapKramer: Ну так вроде у меня так и работает.
Тут два момента есть:
1. Как быть если у одного тега несколько атрибутов data-
2. С вложенностью исходных тегов разбираться надо. Сначала найти самый нижний,- преобразовать его и так пузырьком подниматься до самого верхнего уровня вложенности.
Тяжко такого монстра в одну регулярку запихать. Если вообще возможно

Answer 1

[Rsa97]

Никак. Регулярные выражения не предназначены для разбора вложенных конструкций.

Answer 2

[Петр Васильев]

На фронте ? Используйте jquery. $("[data]").each(function(){ваш код})