contenteditable = "true" 创建的文本框，文本框中有带有标签、的文本，如何正确的在光标处插入带标签文本

在使用 contenteditable 属性创建的文本框中，如果要在光标处插入带标签的文本，可以通过以下方式实现：

1. 获取当前光标位置

可以使用以下代码获取当前光标的位置：

var selection = window.getSelection();
var range = selection.getRangeAt(0);

2. 创建新的 HTML 元素

可以使用以下代码创建新的 HTML 元素：

var newNode = document.createElement("span");
newNode.innerHTML = "要插入的带标签文本";

在这里以创建一个 span 元素为例，如果要插入其他类型的元素，只需要将 createElement 方法的参数换成对应的标签名即可。

3. 插入新的 HTML 元素

可以使用以下代码将新的 HTML 元素插入到光标位置：

range.insertNode(newNode);

完整的实现代码如下：

function insertHTMLAtCursor(html) {
  var selection = window.getSelection();
  var range = selection.getRangeAt(0);
  var newNode = document.createElement("span");
  newNode.innerHTML = html;
  range.insertNode(newNode);
}

调用该函数即可在光标处插入指定的带标签文本。需要注意的是，如果要插入的 HTML 元素中包含有特殊字符，需要进行编码处理。