在一个字符串遍历中将** title **转换为<h1> title </h1>的最佳方法是什么？

Question

假设有一大段文字，转换规则为：

• **title**至<h1>title</h1>

• :blush:至<img class="emoji" title="blush" src="/img/blush.png"/>

如何在一次遍历中进行转换？

Answer 1

执行此类操作的最佳方式是regex - 它是针对每种语言中此类任务的非常优化的机制。

根据你的例子，在javascript中

：

>>> "**title** qweqwe **foo** ololo **bar**".replace(/(\*\*(\w+)\*\*)/g, "<h1>$2</h1>")
"<h1>title</h1> qweqwe <h1>foo</h1> ololo <h1>bar</h1>"

和

":blush: qweqwe :tongue: ololo :smile:".replace(/(\:(\w+)\:)/g, '<img class="emoji" title="$2" src:="/img/$2.png"/>')
"<img class="emoji" title="blush" src:="/img/blush.png"/> qweqwe <img class="emoji" title="tongue" src:="/img/tongue.png"/> ololo <img class="emoji" title="smile" src:="/img/smile.png"/>"

多田！

Answer 2

你可以试试这个：

<div id="replace">**title**some text :blush: some link </div>
var str= $("#replace").html();    
str = str.replace("**title**", "<h1>title</h1>");     
str = str.replace(":blush:", "<img class="emoji" title="blush" src:"/img/blush.png"/>");     
$("#replace").html(str);    

Answer 3

使用不同的捕获组捕获1个正则表达式中的不同模式，并使用替换函数检查不同的捕获组：

＆＃13;

＆＃13;

var input = '**Hey** Oh you! :blush:';
document.write(input.replace(/\*\*([^*]*)\*\*|:(happy|blush):/ig, function(match, title, smiley) {
  if (title != undefined) {
    return '<h2>' + title + '</h2>';
  } else if (smiley != undefined) {
    return '<img class="emoji" title="blush" src="/img/' + smiley + '.png" />';
  }
}));

＆＃13;

＆＃13;

＆＃13;

这是本页面上只有一次遍历的唯一答案。请注意，它不会抓住这个：

var text = '**title with :blush: smiley** gotcha!';

Answer 4

您可以使用正则表达式解决此问题。

var mystring = 'some text **title** some other text';
var re = /\*{2}(\w*)\*{2}/g;
mystring.replace(re, "<h1>$1</h1>");

这里正则表达式搜索以两个*开头并以两个*结尾的任何模式。中间部分被捕获并用于替换方法。

Answer 5

标题

var re_title = /\*\*(.+)\*\*/g;
str.replace(re_title, '<h1>$1</h1>')

表情符号

var re_emoji = /:(.+):/g;
str.replace(re_emoji, '<img class="emoji" title="$1" src="/img/$1.png"/>')

你可以通过一个接一个地替换它们来将它们组合在一起。

str.replace(re_title, '<h1>$1</h1>').replace(re_emoji, '<img class="emoji" title="$1" src="/img/$1.png"/>')

样品

var str = '**title** :some_emoji:'
str.replace(re_title, '<h1>$1</h1>').replace(re_emoji, '<img class="emoji" title="$1" src="/img/$1.png"/>')
// output = "<h1>title</h1> <img class="emoji" title="some_emoji" src="/img/some_emoji.png"/>"

var str = '**:some_emoji: **'
str.replace(re_title, '<h1>$1</h1>').replace(re_emoji, '<img class="emoji" title="$1" src="/img/$1.png"/>')
// output = "<h1><img class="emoji" title="some_emoji" src="/img/some_emoji.png"/></h1>"

由于无法命名捕获组，因此＆＃39; a | b＆＃39;正则表达式语法不能用于替换。