JS:在textarea中搜索特定字符串

Question

我正在为JavaScript入门课程做一个项目，我真的需要在一个方面的帮助。

如何在剧本中的文本块中搜索字符串？例如，如何在下面的文本中搜索Messenger并将其用作值？

与其像下面这样有一整块文本，它应该更像这样的格式：

AGAMEMNON: //dialogue

CLYTAEMNESTRA: //dialogue

阿伽门农//对话

到目前为止，我已经尝试过.match属性和.indexOf属性，但是不知道我的其他选项是什么。

请帮帮我！

克莱塔内斯特拉别这么说只是为了无视我的安排。阿伽门农，你应该知道，我不会重蹈覆辙。那么，克莱塔内斯特拉，你必须害怕什么，才能这样做。你已经向众神许下了诺言。1100阿伽门农我说了我的最后一句话。我和任何男人一样，都完全明白我在做什么。克莱塔内斯特拉，如果他有你的成功，你认为普里阿姆会怎么做？阿伽门农，很明显，他会穿过这些挂毯。克莱塔涅斯特拉，那为什么要为人们说的话感到羞愧呢？阿伽门农但是人们所说的都有很大的力量。CLYTAEMNESTRA是真的，但是人们不嫉妒的人是不值得他们嫉妒的。

Answer 1

1)获取文本区域的文本内容。

var txt = document.querySelector('textarea').textContent;

2)定义正则表达式，将文本的区域划分为组件部分。

var regex = /[A-Z]+ [\w’, ]+\./g

3)返回一个匹配数组

var roles = txt.match(regex);

4)对数组进行map，并返回名称和描述的HTML数组。

var html = roles.map(function (role) {
  role = role.replace(/([A-Z]+) /, '$1:').split(':');
  return [
    '<div class="name">',
    role[0],
    '</div>',
    '<div class="desc">',
    role[1],
    '</div>'].join('');
});

5)将HTML添加到DOM中

document.getElementById('out').innerHTML = html.join('');

输出

CLYTAEMNESTRA 别这么说只是为了无视我的安排。 AGAMEMNON 你应该知道我不会违背我说过的话。

演示