字符串拆分方法（每行）javascript

Question

我正在尝试为程序编写代码，允许用户在文本框中输入单词或句子，然后按按钮。

当用户按下按钮时，结果应显示

实际上，我在最后一部分遇到了一个问题，即拆分句子并将每个句子放在单独的行中。

我所知道的是，我可以通过编写如下代码将它们放在单独的行中：

var myString = "zero one two three four";

var mySplitResult = myString.split(" ");

for(i = 0; i < mySplitResult.length; i++){
    document.write("<br /> Element " + i + " = " + mySplitResult[i]); 
}

但是当我这样做时，它不起作用

我的密码

 function t {
    var r=input.split(".");
             for (var i = 0; i < r.length; i++){
        r.innerHTML ="<br/> "  + r[i];}
          } 

Answer 1

您正在用for循环的每次迭代覆盖您的result.innerHTML

尝试制作一个var str来保存您计算出的字符串，并在for循环中对其进行迭代。

str + =“输入字符串的长度：” + input.length +“

空格数：“ + num +”

“ +”

将单词“ red”替换为“ blue”：“ + input.replace（” red“，” blue“）+”

吐在'。'：

“ +”
“ + n [i];

然后在for循环之外

result.innerHTML = str

Answer 2

 for (var i = 0; i < n.length; i++) { result.innerHTML = "Lenrth of input string: "+ input.length + "<p>Number of spaces: "+num +"</p>" + "<p> Replacing the word 'red' with 'blue': "+ input.replace("red" , "blue")+"</p>" + "<p>Spilting at'.':</p><br/> " + n[i]; } 

这样，您将分配给result.innerHTML并在每个循环回合 result.innerHTML其覆盖-因此您将注意到的输出只是最后一个循环回合的输出。 相反，您应该逐步构建html字符串（包括重复），然后分配整个内容。

var html = "<p>Length of input string: " + input.length + "</p>";
html += "<p>Number of spaces: " + num + "</p>";
html += "<p> Replacing the word 'red' with 'blue': " + input.replace("red" , "blue") + "</p>";
html += "<p>Spilting at '.':<ul>";
for (var i = 0; i < n.length; i++) {
    html += "<li>" + n[i] + "</li>";
}
html += "</ul></p>";
result.innerHTML = html;

Answer 3

您的for循环将替换每次迭代中的内容。 您只需要使for循环将n的元素附加到result元素的innerHTML即可。

function F1()
{  
  var str =document.getElementById("text");
  var input =  str.value;
  var result = document.getElementById( "result" );
  var num =  input.split(" ").length - 1;
  var n=input.split(".");

  result.innerHTML = "Lenrth of input string:  "+ input.length +"<p>Number of spaces:  "+num +"</p>"
  +"<p> Replacing the word 'red' with 'blue':  "+ input.replace("red" , "blue")+"</p><p>Spilting at'.':</p>";

  for (var i = 0; i < n.length; i++){
    result.innerHTML += "<br/> "  + n[i];
  }
}  

这是jsFiddle上的一个工作示例： http : //jsfiddle.net/nQ39D/