【问题标题】：multiline random text using js使用js的多行随机文本
【发布时间】：2020-06-19 03:09:47
【问题描述】：

我正在尝试制作一个 随机文本生成器，它可以生成多行但它总是在 HTML 页面上的同一行（我已经尝试过 \n，但它没有不工作）。

我在 chrome 上对其进行了测试，但如果可能的话，我能得到一些帮助吗？

这里是我使用的代码：(live demo)

function rtg(maxChar, maxLines) {
var ranChar = "";
var count;
var alphabet = "A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,r,s,t,u,v,w,x,y,z,1,2,3,4,56,7,8,9,0".split(",");

for (var i = 0; i < maxLines; i++) {
     var rand = null;
     for (var x = 0; x < maxChar; x++) {
         count++;
         rand = Math.floor(Math.random() * alphabet.length);
         ranChar += alphabet[rand];
         if (maxChar == count) {
          //this part i need help with
             ranChar += '\n'
             count = 0;
         }
      }
   }
}

【问题讨论】：

你试过<br/>吗？当您在浏览器中显示数据时，html 标签应该可以工作
ranChar += '<br/>'

标签： javascript html string for-loop random

【解决方案1】：

\n 在 HTML 中无法识别，除非您使用 css 属性 white-space: pre-line（或将您的文本放在 <pre>Your Text Here</pre> 标记内。另一种方法（可能更可取）是添加 '<br/>' 而不是 @987654325 @当你想转到下一行时

【讨论】：

white-space: pre-wrap 两者都做，虽然你没有错。

【解决方案2】：

这里有一些不必要的变量，所以我稍微简化了你的代码。 i 和 x 是你的计数，所以你真的不需要 count 变量。如果您将其放在页面的 HTML 中，您还应该使用 <br/> 而不是 \n。

function rtg(maxChar, maxLines) {
  var lines = "";
  for(var i = 0; i < maxLines; i++) {
    if(i > 0) lines += "<br/>";
    for (var x = 0; x < maxChar; x++) lines += rando("ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnoprstuvwxyz1234567890");
  }
  return lines;
}

window.addEventListener("load", function(){
  document.getElementById("result").innerHTML = rtg(12, 5);
});

<script src="https://randojs.com/1.0.0.js"></script>
<div id="result"></div>

这段代码使用randojs.com来简化随机性，所以如果你想使用这段代码，只要确保你的html文档的head标签中有这个：

<script src="https://randojs.com/1.0.0.js"></script>

回应您的评论：

如果你想链接你自己的外部js文件，你可以在同一个目录下制作两个文件：1个html文件，1个名为“script.js”的js文件。在 HTML 文件中，将其用作您的 HTML 代码：

<html>
    <head>
        <script src="https://randojs.com/1.0.0.js"></script>
        <script src="script.js"></script>
    </head>
    <body>
        <div id="result"></div>
    </body>
</html>

在 script.js 文件中，使用这个：

function rtg(maxChar, maxLines) {
  var lines = "";
  for(var i = 0; i < maxLines; i++) {
    if(i > 0) lines += "<br/>";
    for (var x = 0; x < maxChar; x++) lines += rando("ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnoprstuvwxyz1234567890");
  }
  return lines;
}

window.addEventListener("load", function(){
  document.getElementById("result").innerHTML = rtg(12, 5);
});

这已经过测试并且工作正常。

【讨论】：

当我在单独的文件中运行 js 并将头部导入脚本时它不起作用（我将 randojs 放在我自己的 js 文件之上）
要么你的 js 有错误，要么你没有正确获取脚本。我已经更新了我的答案以解释如何让它工作。如果有帮助，请告诉我！
我给你的代码有效。你现在问我的是你的配置问题，你应该再发一篇关于它的问题。

【解决方案3】：

你可以用“\n”在字符串中添加一个新行

【讨论】：

这是第一个问题，建议我怎么做