javascript - 给字符串加粗

Question

我有一个带有线条的简单跨度。我只想将包含 Running test: 的行加粗。 所有线路

<span id="results" style="white-space: pre-line">Running test: test1
asasggsa
fasfs
afasaggas
</span>

知道怎么做吗？

应该是这样的

 <span id="results" style="white-space: pre-line"><strong>Running test: test1</strong>
    asasggsa
    fasfs
    afasaggas
    </span>

Answer 1

使用拆分和合并

演示

var value = results.innerHTML; //since results is an id
var textToBold = value.split( "\n" )[0]; //get the first line
results.innerHTML = value.split( textToBold ).join( "<strong>" + textToBold + "</strong>" ); //split by the text to bold and then join with enclosing tags

<span id="results" style="white-space: pre-line">Running test: test1
asasggsa
fasfs
afasaggas
</span>

I just want to bold the line that contains Running test:. All line

在这种情况下使用匹配

演示

var value = results.innerHTML; //since results is an id
var text = "Running test";
var linesToBold = value.split( "\n" ).map( s => s.includes( text ) ?  "<strong>" + s + "</strong>" : s ).join( "\n" );
results.innerHTML = linesToBold

<span id="results" style="white-space: pre-line">Running test: test1
asasggsa
fasfs
afasaggas
</span>