输入:
<div>Many</div><div>Lines</div><div>Goes</div><div>Here</div>
预期输出:
Many<br>Lines<br>Goes<br>Here
我尝试了这样一种方法:
input = input.replace("<div>", ""),
input = input.replace("</div>", "<br>")
虽然这是有效的,但解决方案并不是最优的。
干杯
使用全局正则表达式,而不是字符串:
input = input.replace(/<div>/g, '');
input = input.replace(/</div>/g, '<br>');
console.log(input); // Many<br>Lines<br>Goes<br>Here<br>
更多详细信息:
replace()函数可以将,作为第一个参数:
- 字符串,如
'</div>'
- RegExp,如
/</div>/
无论您使用的是String还是RegExp,replace()
都会找到第一个匹配项并替换它。仅第一个匹配
您需要指定替换是全局的(即每个匹配都应该被替换)。
您有两种选择来进行全局替换:
- 使用正则表达式标志:
input.replace(/</div>/g, '<br>');
- 使用第三个参数,它是标志的组合:
input.replace('</div>', '<br>', 'g');
警告:
String.replace方法中flags参数的使用是非标准的。不要使用此参数,而是使用具有相应标志的RegExp对象。
由于第三种参数方式是而不是标准的,因此建议您使用RegExp方式。
只是为了好玩:
你也可以在一行中完成:
input = input.replace(/<(/)?div>/g, function(m, p) { return p ? '<br>' : ''; });
/*
input.replace(
/<(/)?div>/g, -> regex to match '<div>' and '</div>'
function(m, p) { -> m = whole match, p = first capturing group
return p -> if p is defined, ie. if we've got a slash
? '<br>' -> we matched '</div>', return '<br>'
: ''; -> we matched '<div>', return ''
}
);
*/
你可以做:
input = replace(/<div>(.*?)</div>/, "$1<br>")
在这个问题的答案中可以找到其他几个使用匹配组执行替换的选项。
尝试操作DOM。下面的脚本将生成您需要的内容:
演示
function insertAfter(referenceNode, newNode) {
referenceNode.parentNode.insertBefore(
newNode,
referenceNode.nextSibling);
}
var divTags = document.getElementsByTagName('div');
for (var i = 0; i < divTags.length;) {
var div = divTags[i];
var text = document.createTextNode(div.innerHTML);
div.parentNode.replaceChild(text, div);
insertAfter(text, document.createElement('br'));
}
如果您能更好地指示<div>
和</div>
之间的字符串类型,那将有所帮助。
http://regexr.com?37j2q
input = input.replace(new RegExp("<div>([a-zA-Z0-9]+)</div>", "mg"), "$1<br>");
http://jsfiddle.net/2GwQv/2/