Textarea 改变部分文字颜色大小
时间: 2024-02-06 22:04:02 浏览: 34
你可以使用 HTML 和 CSS 来实现Textarea 中部分文字的颜色和大小改变。具体实现方法如下:
1. 在Textarea 中使用 HTML 标签,例如使用 `<span>` 标签来包裹需要改变颜色和大小的文字。
2. 在 CSS 中为这个 `<span>` 标签设置颜色和字体大小。例如:
```
span {
color: red;
font-size: 20px;
}
```
这里将 `<span>` 标签中的文字颜色设置为红色,字体大小设置为 20px。
3. 在 JavaScript 中监听 Textarea 内容的变化,然后使用正则表达式来匹配需要改变颜色和大小的文字,将其用 `<span>` 标签包裹起来。例如:
```
var textarea = document.getElementById("myTextarea");
textarea.addEventListener("input", function() {
var text = textarea.value;
var newText = text.replace(/(需要改变颜色和大小的文字)/g, "<span>$1</span>");
textarea.innerHTML = newText;
});
```
这里将需要改变颜色和大小的文字使用正则表达式匹配出来,并使用 `<span>` 标签包裹起来,然后将包裹后的内容重新设置到 Textarea 中。
注意,因为 Textarea 不支持内嵌 HTML 标签,所以使用上述方法只是在 Textarea 中模拟了一段 HTML 代码。如果需要将这段代码提交到后端进行处理,需要将 `<textarea>` 标签替换为 `<div>` 标签等支持内嵌 HTML 的标签。