Javascript 如何在textarea中更改特定文本而不是整个文本的字体样式

我想做一个类似于在线txt编辑器的东西。问题是，当我尝试应用

document.getElementById（“textArea”）.style.fontwweight=“bold”，整个文本区域变为粗体。我只想在粗体被切换为粗体时显示文本，我猜类似于microsoft word。问题：如何更改textarea中特定文本的字体样式。我是初学者，所以我只知道如何使用javascript和jquery。

HTML

<button onclick="Bold()"><h3>Bold</h3></button>
<textarea id="textArea" class="Textarea" placeholder="Click to Type" cols="50"></textarea>

您不能使用
textarea
字段来设置样式，因为您只能在HTML元素中设置样式。必须使用具有
contenteditable
属性的元素，并将样式设置为HTML格式，以自定义所需的输入样式

示例：

<div id="textarea" contenteditable="true">
    <b style="color: red">My bold text in red.</b> =)
</div>

但是如何使用javascript访问div中的特定文本呢？请再次阅读我的答案。我解释了如何做到这一点。但如何在切换粗体后输入粗体文本。我不明白。您的意思是更改editablecontent区域中的粗体文本吗？只需按CTRL

+

B

。但将文本加粗并不是你的第一个问题，我现在对你希望我们帮助你做什么感到困惑。我有一个“加粗”按钮。按下此按钮后，按下后键入的文字将变为粗体。我的问题是我不知道怎么做。我所知道的就是如何使文本加粗。

<div id="textarea" contenteditable="true">
    <b style="color: red">My bold text in red.</b> =)
</div>

<script type="text/javascript">
    var textarea = document.getElementById("textarea"); // contenteditable element
    var textarea_value = textarea.innerHTML; // contenteditable element value

   // getting specific text, here we are getting the bold text
   var bold_element = textarea.querySelectorAll('b')[0].innerHTML;
</script>