在html中的文本区域中自动着色

Question

我正在尝试制作代码编辑器。 只是一个简单的。 想知道如何在<textarea>内设置文本样式，而不需要使用<span class="function"></span> 因为文本不断更新.. 使用纯（javascript或css）（请不要jquery或库） 感谢您的任何建议

Answer 1

textarea支持oninput事件，每次输入时都会触发事件。例如：

<textarea oninput="testFunction()"></textarea>
<script>
function testFunction() {
    console.log("input has changed");
}
</script>

这应该让您在编写所需的vanilla JS代码方面有一个良好的开端。

Answer 2

你有没有尝试过这样做？

您可以轻松完成，只需添加style="color: orange; <textarea>就像这样：

<textarea style="color: orange;"></textarea>

或者你可以像这样在css中添加它：

textarea {
    color: orange;
}

您可以在css中的textarea { }内将其设置为您想要的样式。

Answer 3

把它放在你的CSS中：

    textarea {
    font-family: arial;
}

您可以将字体系列更改为您想要的任何内容