javascript - 如何修复输入向后返回的问题

Question

由于某种原因，当输入输入时，它会反向返回。我可以使用 for 循环让它工作，但是如何使用 while 循环来做到这一点？

 var input = document.getElementById('userinput').value;
 var i  = input.length;
 while (i--) {

    document.getElementById('message').innerHTML += input[i] + "<br/>";

  }

Answer 1

反转循环计数器和条件:

var input = document.getElementById('userinput').value;
var i = 0;
while (i < input.length) {
  document.getElementById('message').innerHTML += input[i] + "<br/>";
}

或者反转循环内的串联顺序:

var input = document.getElementById('userinput').value;
var i  = input.length;
while (i--) {
  document.getElementById('message').innerHTML =
          input[i] + "<br/>" + document.getElementById('message').innerHTML;
}

请注意，无论哪种方式，您都不应该在循环中更新 .innerHTML:作为一般原则，尽量减少 DOM 更新，因此使用临时变量来构建所需的字符串，然后分配 .innerHTML 一次在循环之后。或者对于您实际上在这里所做的事情，您不需要循环:

var input = document.getElementById('userinput').value;
document.getElementById('message').innerHTML = input.split("").join("<br>");