Question

我正在从“ http://p ****。i *****。fi / food.txt”中获取数据，这些数据像这样相互排列，1
   2
   3
   4，但它像1 2 3 4一样将那些数字彼此相邻打印，是否可以按原样打印？

function Doc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("demo").innerHTML =
      this.responseText;
    }
  };
  xhttp.open("GET", "http://p****.i*****.fi/food.txt", true);
  xhttp.send();
}

<div id="demo">
<button type="button" onclick="Doc()">Content</button>
</div>

Answer 1

您可以使用以下CSS属性：

white-space: pre;

演示

.pre {
  white-space: pre;
}

<div class="pre">With pre:
1
2
3
4
</div>
<div>Without pre:
1
2
3
4
</div>

Answer 2

在数字之间添加HTML分隔符应将数字放在自己的行上。在显示数据之前，您可能必须解析链接中的数据。

例如document.getElementById("demo").innerHTML = "1 <br> 2 <br> 3 <br> 4"

Answer 3

循环遍历每个数字，并在每个数字后面添加\ n，这将在下一行强制下一个数字

正确打印数字

3 个答案:

演示