HTML 文本区域着色答案

【问题标题】：HTML textarea coloringHTML 文本区域着色
【发布时间】：2021-02-06 16:49:12
【问题描述】：

我正在尝试使用CSS 和/或JavaScript 为我的HTML textarea 元素着色，因此当我输入内容时它会显示不同的颜色。

例如，如果我输入“Hello world”，我可能希望它是绿色的，因为它是一个字符串。然而，我不知道该怎么做。（提醒：这是在页面上输入，而不是在页面源代码中输入）
我知道这是可能的，因为 W3Schools 做到了。

但是，我似乎不知道如何给它上色。 Here 是 W3Schools 的示例页面。如果你输入一些东西，它会根据它是什么而改变颜色。我不知道如何让它做到这一点。非常感谢您的帮助！

【问题讨论】：

我没有得到你想要达到的目标
如果我错了，请纠正我：您想创建一个文本区域，可以根据特定关键字的内容更改特定关键字的颜色。换句话说，你想要语法高亮？
@Spectric 这就是我的意思。不过，我不知道该用什么词。
我建议您看看highlist.js，因为通常不值得花时间编写语法突出显示。
@Spectric 谢谢你的帮助！ :)

标签： html css colors

【解决方案1】：

我建议使用像 https://markjs.io 这样的库，因为从零开始实现它会花费太多时间。

这是一个突出显示“找到的单词”的示例

$(function() {
  var $input = $("input[name='keyword']"),
    $context = $("table tbody tr");
  $input.on("input", function() {
    var term = $(this).val();
    $context.show().unmark();
    if (term) {
      $context.mark(term, {
        done: function() {
          $context.not(":has(mark)").hide();
        }
      });
    }
  });
});

【讨论】：

哦，我的错，对不起。我已将答案更改为正确的答案。