\t 在 JavaScript 中不起作用 [关闭]答案

【问题标题】：\t is not working in JavaScript [closed]\t 在 JavaScript 中不起作用 [关闭]
【发布时间】：2014-05-05 09:34:39
【问题描述】：

我试图只在 2 个文本之间使用 \t，但 \t 选项卡不起作用，并且在 2 个文本之间没有空格。我试图只使用间距，但这也不起作用。任何超过 1 个空格的内容似乎都会被修剪。

我环顾四周，大多数人都说 javascript 会自动修剪，因此制表符和额外间距不起作用。另一个是它在某些浏览器中无法识别。我正在使用 Chrome。

遇到上述回复，我没有看到任何解决方案。有没有办法禁用自动修剪？谢谢。

【问题讨论】：

HTML 中没有选项卡之类的东西。
请张贴一些代码来展示你在做什么——JavaScript 和 HTML，如果适用的话。您的问题遗漏的最重要的细节是文本的显示位置。如果它在网页中，即在 HTML 中，那么您会发现所有连续的空白都被视为单个空格。
为此使用 css。 text-indent、margin-left 或 white-space。
@Diodeus，选项卡，U+0009 : CHARACTER TABULATION，在所有版本的 HTML 中都允许。它只是充当空白字符，不会导致制表，除非在特定上下文中。
这个问题似乎离题了，因为它揭示了对 HTML 中空白本质的根本无知，通过快速的 Google 搜索或简单的教程很容易找到。

标签： javascript html whitespace

【解决方案1】：

在 JavaScript 的字符串文字中使用 \t 会产生制表符 U+0009 : CHARACTER TABULATION。这样没有问题。但是根据定义，制表符是 HTML 中的空白字符，在任何普通内容中，任何空白字符序列都相当于一个空格。

但是，在某些情况下，制表符会导致制表符，制表位设置为每 8 个字符，这通常是不合适的。有 CSS 设置来设置制表位，但浏览器支持有限。

制表符导致制表符的上下文是pre 元素（根据定义）、textarea 元素（在实践中）以及设置了white-space: pre 的元素。但为了有意义，制表符还要求字体是等宽的。

在几乎所有可以想象的情况下，您都应该使用制表符以外的工具，例如 HTML 表格。但由于没有描述具体的背景和目的，所以无法给出具体的建议。

【讨论】：

【解决方案2】：

HTML 将空格减少到 1，而不是 JS。您可以使用 CSS 更改此行为。设置 white-space: pre 使其尊重文本中的所有空格和换行符。

http://www.w3schools.com/cssref/pr_text_white-space.asp

【讨论】：

W3Schools 不是可靠的来源。这是一个更好的链接：developer.mozilla.org/en-US/docs/Web/CSS/white-space

【解决方案3】：

该选项卡将在 JavaScript 本身中运行。如果您看到在控制台中执行的代码，大多数（如果不是每个浏览器）都会显示您希望的标签页数。

您可能在 HTML 中打印此内容，它会忽略多个空白字符，除非它们明确打印为 &nbsp; 字符实体。

有关如何在 HTML 中打印的更多信息，请参阅this question

或者，您可以使用 CSS white-space property 更改一组元素的此行为

【讨论】：

【解决方案4】：

.div1{
  background-color:#27AE60;
  width:80%;
  height:200px;
  margin:auto;
  border-radius:15px;
}
h1{
  color:white;
  font-size:18px;
  font-weight:bold;
  font-family:'Roboto slab';
  text-align:center;
  padding-top:10px;
}
p{
  color:white;
  font-size:15px;
  font-weight:normal;
  text-align:center;
  padding-top:40px;
}

<html>
  <head>
  <title>wsdfa</title>
  </head>
  <body>
    <div class="div1">
     <h1> HELLO WORLD</h1>
      <p>This is my first page of HTML CSS</p>
    </div>
  </body>
</html>

【讨论】：

不错的尝试.......