Замена данных в html используя xml

[dima85]

В переменной data, хранится html блок:

<div>
 <h5>тест</h5>
 <div>{time}</div>
 <a href="{ip}">Страница</a>
</div>

В переменной xml хранится:

<?xml version='1.0'?>
<new><time>10.00</time><ip>127.0.0.1</ip></new>

Нужно смотреть {*} в data, они равный данным с xml и вставить эти данные в data. Подскажите пожалуйста как это сделать.

Должно получится так:

<div>
 <h5>тест</h5>
 <div>10.00</div>
 <a href="127.0.0.1">Страница</a>
</div>

[dima85]

Вот такой вариант ищет и заменяет {ip}

$(xml).find('ip').each(function(){
var text=$(this).contents().eq(0).text();
var new_string = data.replace('{ip}',text);
alert(new_string);
 });

Подскажите пожалуйста как сделать цикл, который будит искать все {*}

[Strongman]

Тег <ip> существует?

[dd_smol]

Тег <ip> существует?

Это не HTML а XML в нем нет определенных тегов их разрабочек добавляет сам.

[dd_smol]

Автору темы могу посоветовать воспользоваться готовым решение, а не изобретать велосипед при том что их уже изобретено не мало. https://learn.javascript.ru/templates

[dima85]

Сделал велосипед

var new_string;
      var $kids = $(xml).find("new").children();
       $kids.each(function(){
       var tagName=this.tagName;
       var cols = $(xml).find(tagName).contents().eq(0).text();
       new_string = data.replace(new RegExp('{'+tagName+'}', 'g'),cols);
       data = new_string;
      });

Все работает! Хочу попробовать попытается избавится от jquery и написать на чистом JavaScript помогите пожалуйста.

Начал делать, но появляются ошибки:
SyntaxError: An invalid or illegal string was specified
var elements = document.querySelectorAll(kids);

var new_string;
      var $kids = data2.querySelector('new').childNodes; //Возможно тут не правильно
      var elements = document.querySelectorAll($kids);
      Array.prototype.forEach.call(elements, function(){
       var tagName=this.tagName;
       var cols = $(data2).find(tagName).contents().eq(0).text(); //Не знаю как это сделать
       new_string = data.replace(new RegExp('{'+tagName+'}', 'g'),cols);
       data = new_string;
      });

[dd_smol]

Вариантов много.

Можно так:

var
	html	= '<div><h5>тест</h5><div>{time}</div><a href="{ip}">Страница</a></div>',
	xml		= '<?xml version="1.0"?><new><time>10.00</time><ip>127.0.0.1</ip></new>',
	parse	= new window.DOMParser(),
	docXML	= parse.parseFromString(xml, 'application/xml');

[].slice.call( docXML.documentElement.children ).forEach(function ( el ) {
	html = html.replace( new RegExp('{' + el.tagName + '}', 'g'), el.textContent );
});

Или так:

var 
	xml		= '<?xml version="1.0"?><new><time>10.00</time><ip>127.0.0.1</ip></new>',
	html 	= '<div><h5>тест</h5><div>{time}</div><a href="{ip}">Страница</a></div>';

html = html.replace(/\{([a-z]*)\}/gi, function ($0, $1) {
	return xml.match( new RegExp('<' + $1 + '>(.*)</' + $1 + '>') )[1].trim();
});