如何用HTML标签替换包含字符串的文本?
问题描述:
我正在努力解决如何替换页面上的任何文本实例与HTML标记匹配某个短语 - 内容应该保持不变。如何用HTML标签替换包含字符串的文本?
bold("Hello")
上面的代码应改为:
<b>Hello</b>
这里是我目前使用的代码:
node.data = node.data.replace('bold("','<b>');
node.data = node.data.replace('")','</b>');
这样做的问题是,而不是创建一个<b>
标签,将其转换的<
和>
到他们的HTML实体 - & LT; & gt;。
而且,似乎不切实际与</b>
取代的")
所有实例。
什么是最好的方式来实现这一点。
我希望得到任何帮助,这,谢谢!
答
我想你不要随便指一个网页上的所有文本,而是一个给定的元素中的所有文本。 DucFilans是正确的与正则表达式的钱,我就稍微修改他的回答提供完整有效的解决方案:
var parserRules = [
{ pattern: /bold\("(.*?)"\)/g, replacement: '<b>$1</b>' },
{ pattern: /italics\("(.*?)"\)/g, replacement: '<i>$1</i>' }
];
document.querySelectorAll('.parse').forEach(function(tag) {
var inner = tag.innerHTML;
parserRules.forEach(function(rule) {
inner = inner.replace(rule.pattern, rule.replacement)
});
tag.innerHTML = inner;
});
<div class='parse'>
<div>bold("Hello") world <p> Rose italics("pink") slow bold("!") </p> </div>
<div>bold("astiago") cheeeeeeese!</div>
</div>
您可以定义parserRules阵列中的正则表达式模式和替换规则,然后任何标有'parse'类的元素都将被解析。一个警告是,这将取代所有的子元素,所以如果你依赖于附属于子元素或类似的东西的听众,你也需要照顾。
答
正则表达式可以帮助你更换的关注。
var str = 'bold("Hello")';
var regex = /bold\("(.*?)"\)/;
str = str.replace(regex, "<b>$1</b>");
console.log(str);
您需要使用的createElement工作()代替。 – iquellis
或者,也许这可以帮助你:http://locutus.io/php/strings/htmlentities/ – z3nth10n
什么是'node.data',..? – Keith