为什么 JavaScript 换行符在 HTML 中不起作用?

IT技术 javascript html text-formatting
2021-03-08 11:22:12

我有以下几点:

<html>
  <body>
    <script type="text/javascript">
      document.write('Hello\nWorld')
    </script>
  </body>
</html>

你们可能都知道,\n不起作用,我必须使用它<br>如果我链接到外部.js文件,它也不起作用以下是我的问题:

  1. 为什么不起作用\n
  2. 为什么<br>甚至有效?脚本标签内的所有内容不应该是严格的 JavaScript 而不是 HTML 和 JS 之间的肮脏混合吗?
  3. 是否有可能以\n某种方式工作?
  4. 我知道\t也行不通。任何其他在 HTML 文件中不起作用的东西?
  5. 不相关的问题(我不想为此打开一个新问题):我安装了 Node.js 以便能够从 vim 内部尝试 JS 脚本,但是当我运行这个脚本时,我收到错误“document未定义”。当我从 REPL 尝试时,也会发生同样的事情。有任何想法吗?

在搜索类似问题时,我得到的只是我应该使用<br>而不是\n.

6个回答

为什么不起作用\n

因为空白只是 HTML 中的空白。

为什么<br>甚至有效?

因为它是换行符的 HTML

脚本标签内的所有内容不应该是严格的 JavaScript 而不是 HTML 和 JS 之间的肮脏混合吗?

那是主观的。document.write也被许多人认为是肮脏的。

您可以随时使用createElementcreateTextNode

是否有可能以\n某种方式工作?

<pre>, white-space

我知道\t也行不通。任何其他在 HTML 文件中不起作用的东西?

HTML 不是纯文本。列出所有差异将非常耗时,并且超出 Stack Overflow 的范围。尝试阅读规范。

不相关的问题(我不想为此打开一个新问题)

这是完全无关的。打开一个新问题。

我有:

<div>Hello\nworld</div>

我将以下 css 添加到div类中,现在可以正常工作了:

div {
      white-space: pre-wrap;
  }

我希望这也能解决你的问题。

\n作品。如果您有各种调试器(或类似的开发人员工具),您可以查看文档源,并且您会看到确实有换行符。问题在于您查看页面的方式:您不是在阅读其源代码,而是将其作为 HTML 文档阅读。HTML 中的空白被折叠成一个空格。因此,当您更改源时,它确实会发生变化,尽管当解释为 HTML 文档时,该更改不会显示。

您的 Node.js 错误很可能是由于您在服务器上运行浏览器脚本造成的。即引用 的脚本document旨在在浏览器中运行,其中有一个 DOM 等。虽然通用节点进程没有这样的全局对象,因为它不是浏览器。因此,当您尝试运行引用全局对象的代码时,document假设它存在于浏览器中,它将抛出错误。document.write不存在;如果您想写入屏幕,请尝试console.log或查看其他 util 函数。

当 HTML 呈现时,它会忽略空格。因此,唯一的方法是使用换行符。

使用<br/>而不是\n它会正常工作

document.write()函数将 HTML 写入元素。

<pre></pre>在 html 上使用,它将尊重来自 JS 的文本格式。