如何使用javascript将div / span标签插入textarea？

Question

我的html文件中有一个textarea，.js文件将一些文本行添加到其中。 我希望线条使用不同的颜色。 因此，我想将这些行包装在span / div标记中（以便为每行设置不同的颜色）并将其插入到我的textarea中。

我的文字区域是：

<textarea class="history" cols="150" rows="5" readonly="true"></textarea>

我的.js代码是：

var div = document.createElement('div');

div.setAttribute("color", "green");
div.innerHTML = "hi! there";

document.querySelector(".history").appendChild(div);

运行此代码时，我可以看到div附加在textarea html代码下。 但我在页面的文本区域中看不到文本（“ hi！there”）和div。

有谁能够帮助我？

Answer 1

使用contenteditable属性

<p contenteditable="true">
    <h1>This is a paragraph.</h1>
    It is editable. Try to change this text.
</p>

appendChild函数将元素追加到目标元素之后。

要将内容放入元素中，请像使用div一样使用innerHTML。