javascript - 如果我编写脚本，为什么我会得到一个？

Question

我很难在 </span> 的末尾插入一个空格 document.execCommand()。

document.execCommand("insertHTML", false, "<span class='own-class2'>"+"Test"+"</span>");

这背后的原因是我希望光标在插入后位于<span> 之外。

这是一个简单的 jsFiddle 向您展示我的意思： jsFiddle 在该示例中，如果您单击图像然后写一些东西，则文本将为绿色。这意味着文本仍在范围内。

所以我想要的是在</span> 之后插入一个普通空格。

我已经尝试过的：

• '</span> ' 这样的空间 -> 我在 Chrome 中没有空间。
• 这样的空间 '</span> ' -> 我在 Chrome 中得到 </span> 

所以我的问题是如何添加一个空格以获得与 '</span> ' 或 '</span> ' 等效的结果 而不是 '</span> ' ？

我从检查员那里得到什么：https://ibb.co/cqCW2x

如果我这样做：

document.execCommand("insertHTML", false, "<span class='own-class2'>"+"Test"+"</span>&#32;");

Answer 1

也许您可以使用零宽度不换行符（不可见字符）：\uFEFF。

此解决方案的优点是它不会在跨度之后创建（也许？）不需要的可见空间

function Test() {
document.execCommand("insertHTML", false, "<span class='own-class2'>"+"Test"+"</span>\uFEFF");
}

#textBox {
	width: 540px;
	height: 200px;
	border: 1px #000000 solid;
	padding: 0;
	overflow: scroll;
}
.own-class2 {color:green;}

<div id="toolBar">		
	<button height="20px" onclick="Test()" >insert a span</button>
</div>
<div id="textBox" class="textbox" contenteditable="true"></div>