如何在不使用 innerHTML 的情况下在 JavaScript 中添加不间断的空格？答案

【问题标题】：How do I add a non-breaking whitespace in JavaScript without using innerHTML?如何在不使用 innerHTML 的情况下在 JavaScript 中添加不间断的空格？
【发布时间】：2013-11-17 13:47:10
【问题描述】：

我正在动态生成内容，在某些情况下，我需要将&nbsp; 设置为<span> 元素的唯一内容。

但是，以下将&nbsp; 添加为文本而不是添加空格：

var foo = document.createElement("span")
foo = document.createTextNode("&nbsp;");

这是有道理的，所以我想知道，如果没有（！）使用innerHTML，我将如何正确添加&nbsp;

感谢您的帮助！

【问题讨论】：

您为什么不想使用innerHTML？
试试：document.createTextNode("\u00a0");
@David：因为我正在寻找一种方法来通过现有方法运行它，而无需添加额外的子句来使用 innerHTML 以防我需要添加空格。

标签： javascript whitespace innerhtml createelement createtextnode

【解决方案1】：

您可以为 non breaking space 使用 unicode 文字：

var foo = document.createTextNode("\u00A0");

【讨论】：

text = text.replace(/\s/g, '\u00A0'); - 用它们的 unicode 文字替换所有空格
这是完美的。它也适用于 JQuery text() 命令：link.text("(hide\u00A0info)");

【解决方案2】：

如果不想使用innerHTML，可以使用十六进制转义。

最常见的：

\x20 – 标准空间或\s
\xC2\xA0 – 不间断空格或&nbsp;
\x0D - 回车或\r
\x0A – 换行符或\n
\x09 - 选项卡或\t

在你的情况下：\xC2\xA0

【讨论】：

查看此网站了解更多信息[link] utf8-chartable.de/…

【解决方案3】：

将不间断空间附加到您的父节点，让我们在下面将其称为“父节点”，即：

parent.append("\u00A0");

来源：https://developer.mozilla.org/en-US/docs/Web/API/ParentNode/append

【讨论】：

我知道您是该平台的新手。除非您有现有答案未涵盖的内容，否则您不应回答问题。
我认为使用 .innerHTML 来添加一个简单的因为它非常慢并且还可能增加安全风险；因此我的回答应该在这种情况下看到。
所以，在答案中表明你的观点：) 解释为什么 innerHTML 是一个不好的选择，添加引用，你可以创建代码 sn-ps，你可能会发现它很慢。欢迎加入社区