Javascript 为什么innerHTML属性会自动修剪字符串？

这是我的密码：

函数myFunction（）{
var str=“你好世界”；
document.getElementById（“demo”）.innerHTML=str；
警报（str）；
}

试试看

它不是innerHTML。真正的罪魁祸首是浏览器。您无法在浏览器中直接使用字符串文本查看空格，因为所有浏览器都会截断HTML中的空格。您必须使用

查看它们

当浏览器处理html时，它遵循一些规则

这是你的电话号码

如果“空白”设置为“正常”、“nowrap”或“前置行”

每个制表符（U+0009）都转换为一个空格（U+0020）

在另一个空格（U+0020）之后的任何空格（U+0020）-即使是内联之前的空格，如果该空格的“空白”也设置为“正常”、“nowrap”或“pre-line”-将被删除

在HTML中，标记之间的常规空白字符不会被解释为要由浏览器呈现的空白。

声明它们中的一个或多个将得到相同的结果：它们被折叠并渲染为单个空间

要呈现多个空白，有两种方法：


在纯HTML中，使用
实体（
，或不间断空格）

在CSS中，使用
空白
属性：
空白：预换行


预包装

保留空格序列。换行时换行
填充行框所需的字符、at和

来源：
这取决于浏览器

如果您想确保有足够的空间，请执行以下操作：

function myFunction() {
var str = "  Hello World  ";
document.getElementById("demo").innerHTML="&nbsp" + str + "&nbsp";
alert(str);
}
myFunction();

如果您想看到这些空白，可以使用CSS的属性并将其设置为
pre
（仅在给定换行符时中断）或
pre-wrap
（必要时中断）

然而，您确定您真的想在HTML中定位文本吗？是否有任何原因让您离开空格，而是在元素上使用
填充
来移动其内容？
这种方法的问题是，在该位置上不能断行。@Stephan这是一种简单的HTML方式。这种方法是有效的。但无论如何，指定两者都是有意义的。我刚才也添加了CSS方式。起初，缺少分号。此外，即使
str
不包含任何空格，也会呈现两个额外的空格，如果包含的空格超过2x2，则会呈现太少的空格。