Замена данных в html используя xml
В переменной 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> |
Вот такой вариант ищет и заменяет {ip}
$(xml).find('ip').each(function(){ var text=$(this).contents().eq(0).text(); var new_string = data.replace('{ip}',text); alert(new_string); }); Подскажите пожалуйста как сделать цикл, который будит искать все {*} |
Тег <ip> существует?
|
Цитата:
|
Автору темы могу посоветовать воспользоваться готовым решение, а не изобретать велосипед при том что их уже изобретено не мало. https://learn.javascript.ru/templates
|
Сделал велосипед :)
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; }); |
Вариантов много.
Можно так: 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(); }); |
Часовой пояс GMT +3, время: 14:33. |