Question

让我说给我

const s = "Old Man's War"
//Each indices represent the beginning and end index of the string
const indices = [
     [ 0, 0 ],
     [ 5, 5],
     [ 11, 11]
]

索引代表我要突出显示的内容的开始和结束。所以我想返回类似的东西

<span class="bold">O</span>ld M
<span class="bold">a</span>n's W
<span class="bold">a</span>r

我该怎么做？似乎无法提出一种不错的算法。

Answer 1

一种选择是将字符串.split()放入数组，在每个起始索引前添加<span class="bold">，在每个结束索引后附加</span>，然后.join()一起返回：

const s = "Old Man's War"
const indices = [[0,0],[5,5],[11,11]]

let result = indices.reduce((str, [start,end]) => {
  str[start] = `<span class="bold">${str[start]}`;
  str[end] = `${str[end]}</span>`;
  return str;
}, s.split("")).join("");

document.getElementById("result").innerHTML = result;

.bold { font-weight: bold; }

<div id="result"></div>

Answer 2

您可以尝试这样的事情

首先根据索引获取字符串切片
如果当前索引与0th索引的第一个值匹配，则遍历字符串，然后将map中的切片后的字符串添加到最终字符串，并将索引的第二个值增加索引的第0个元素（结束索引）< / li>
通常将其附加到最终字符串

const s = "Old Man's War"
const indices = [[0,0],[2,4],[5,5],[11,11]]

const final = indices.map(([start,end])=> s.slice(start,end+1))

let output = ''

for(let i=0; i<s.length; i++){
  if(indices[0][0] === i){
    output += `<span class="bold">${final[0]}</span>`
    i += indices[0][1]
    indices.shift()
    final.shift()
  } else{
    output += s[i]
  }
}

document.getElementById("result").innerHTML = output;

.bold { font-weight: bold; }

<div id="result"></div>

根据给定的索引突出显示一个字符串

2 个答案: