JavaScript 在添加 <br> 时崩溃

Question

很多天以来，如果我想添加 <br>，我就被困住了与 elem.innerHTML += '<br>'或 document.createElement('br') ，整个网站崩溃。 但是，如果我使用普通字母执行此操作，则效果很好。

  function setSpace(elem){
    if((elem.clientHeight-49)/16 >= 1){
      for(var i=0; i <= (elem.clientHeight-49)/16; i++){
        elem.innerHTML += '<br>';
      }
    }
  }

我该如何解决这个问题？

Answer 1

循环有永远不会完成的风险，因为您在每次迭代中都会扩展元素的高度，这也会影响循环的停止条件。 elem.clientHeight 增加，i 可能永远不会大于 (elem.clientHeight-49)/16。

一个出路是首先将限制放入一个变量中，然后使用它:

 function setSpace(elem){
    let end = (elem.clientHeight-49)/16;
    if (end >= 1){
      for(var i=0; i <= end; i++) {
        elem.innerHTML += '<br>';
      }
    }
  }

...但还是要小心，因为下次调用 setSpace 时它会添加更多的换行符。如果你一直调用这个函数，你将永远不会停止添加换行符。

检查您使用此代码的真正目的。

有更好的方法可以为元素添加间距，例如使用 CSS padding-bottom。