如何将div/span标记插入到使用javascript的textarea中？

Question

我在我的html文件中有一个textarea文件，我的.js文件中添加了一些文本行。我希望线条有不同的颜色。所以我想将这些行包裹在span/div标签中（为了设置每行的不同颜色）并将它们插入我的textarea。

我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在页面的textarea。

任何人都可以帮助我吗？

Answer 1

使用contenteditable属性，

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

的appendChild功能追加目标元素之后的元素。

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