用HTML元素替换字符串中的字符

Question

我从服务器获取系统日志并将它们提供给我的小部件，该小部件将新日志附加到日志容器元素。日志是这样的：

2017-06-0512:11:53.066|error[61f4cdd07abb]sequential(sequential)|interval(0)Error:... 

我用jQuery附加像这样：

returnElement.append('<span class="message">' + log.message + ' </span><br>'); 

不过，我想的风格，像在日志中分隔符这些管道符号|

最好的办法是做什么？可能不得不用另一个span来包装它们，但我想避免每个日志的子串。

Answer 1

你可以用一个RegExp做到这一点，例如：msg.replace(/(\|)/g, '<span class="delimiter">$1</span>')

var msg = '2017-06-0512:11:53.066|error[61f4cdd07abb]sequential(sequential)|interval(0)Error:...'; 
 

 
document.write('<span>' + msg.replace(/(\|)/g, '<span class="delimiter">$1</span>') + '</span>');

.delimiter { 
 
    font-weight: bold; 
 
    color: green; 
 
    font-size: 16pt; 
 
    margin: 10px; 
 
}