如何在 JavaScript 中创建具有多个空格的字符串

Question

通过创建变量

var a = 'something' + '        ' + 'something'

我得到这个值：'something something'。

如何在 JavaScript 中创建一个包含多个空格的字符串？

Answer 1

使用 

它是用来表示不间断的实体space。它本质上是一个标准 space，主要区别在于浏览器不应在其占据的位置打断（或换行）一行文本。

var a = 'something' + '&nbsp &nbsp &nbsp &nbsp &nbsp' + 'something'

不间断Space

HTML 中使用的一个常见字符实体是不间断的 space ( )。

请记住，浏览器将始终截断 HTML 页面中的 space。如果你写 10 spaces 你的文本，浏览器将删除其中的 9 个。要将真实的 space 添加到您的文本中，您可以使用字符实体。

http://www.w3schools.com/html/html_entities.asp

演示

var a = 'something' + '&nbsp &nbsp &nbsp &nbsp &nbsp' + 'something';

document.body.innerHTML = a;

Answer 2

2022 年 - 使用 ES6 Template Literals 完成此任务。如果你需要IE11 Support - use a transpiler.

let a = `something       something`;

模板文字 快速、强大并且生成更简洁的代码。

如果您需要 IE11 支持而您没有 transpiler，请保持坚强并使用 \xa0 - 它是 不间断 SPACE 字符。

参考自UTF-8 encoding table and Unicode characters，可以这样写：

var a = 'something' + '\xa0\xa0\xa0\xa0\xa0\xa0\xa0' + 'something';

Answer 3

您可以将 <pre> 标签与 innerHTML 一起使用。 HTML <pre> 元素表示预先格式化的文本，该文本将完全按照 HTML 文件中的内容呈现。文本通常使用 non-proportional ("monospace") 字体呈现。此元素内的空白显示为所写。如果您不想要不同的字体，只需在 CSS 文件中添加 pre 作为选择器并根据需要设置样式。

例如：

var a = '<pre>something        something</pre>';
document.body.innerHTML = a;

Answer 4

在 ES6 中：

let a = 'something' + ' '.repeat(10) + 'something'

旧答案：

var a = 'something' + Array(10).fill('\xa0').join('') + 'something'

里面的数字Array(10)可以改成需要的空格数

Answer 5

对于模板文字，您可以使用多个空格或多行字符串和字符串插值。模板文字是 ES2015 / ES6 的一项新功能，可让您使用字符串。语法很简单，只用反引号代替单引号或双引号：

let a = `something                 something`;

要制作多行字符串，只需按回车键创建一个新行，没有特殊字符：

let a = `something 

    
                         something`;

结果和你在字符串中写的完全一样。

Answer 6

我的字符串变量本身没有这个问题，只有当字符串转换成html.

可以使用 replace 和正则表达式将空格转换为受保护的空格 replace(/ /g, '\xa0')。

var a = 'something' + '        ' + 'something'

p1.innerHTML = a
p2.innerHTML = a.replace(/ /g, '\xa0')

<p id="p1"></p>
<p id="p2"></p>

顺便说一句，如果您在 contenteditable 中输入许多空格，它们将被翻译为空格和受保护空格的交替序列，您可以在此处尝试：

<p contenteditable onkeyup="result.value = this.innerHTML">put many space into this editable paragraph and see the results in the textarea</p>

<textarea id="result"></textarea>

Answer 7

在 ES6 中，您可以像这样构建字符串：

const a = `something ${'\xa0'.repeat(10)} something`

只需在` ` 之间添加任何 space 并使用 ${var}

打印变量

如何在 JavaScript 中创建具有多个空格的字符串

How to create string with multiple spaces in JavaScript

javascript

html

whitespace

space

html-entities

不间断Space