Question

我遇到以下问题：我有一个HTML文档，我想打印基本状态/调试/等消息。

因此，HTML文档包含一个空的前元素，其id为 out ：

<body onload='init () && main();'>

<pre id='out'>
</pre>

</body>
</html>

init（）函数将pre元素赋给变量：

  var out_div;

  function init() {
      out_div = document.getElementById('out')
      return 1;
  }

然后，为了在pre-div中打印一些内容，我使用了这个函数：

  function txt_out(txt) {
      out_div.innerHTML += "\n" + txt
  }

换行应该确保每次调用txt_out都是在自己的行上写的。这在Firefox中可以正常工作。然而，IE似乎没有注意到\ n。那么，在IE上这是错误的，还是我做错了什么？

Answer 1

这是Internet Explorer中的known problem。要解决此问题，请插入<br>元素而不是换行符。

Answer 2

像element.innerHtml += something;这样的事情通常是一种不好的做法，因为它会使浏览器重新解析元素的全部内容。随着您添加越来越多的数据，每次变得越来越慢。它还使其他代码段可能对其子元素具有的任何引用/事件侦听器无效。

最好使用div标记;类似的东西：

<div id='out'></div>

然后动态添加新的子元素：

out_div = document.getElementById('out');

// add a new message
new_element = document.createElement('div');
new_element.textContent = "your message here";
new_element.className = "some_class"; // CSS class for changing the appearance
out_div.appendChild(new_element);

Answer 3

将您的代码更改为：

function txt_out(txt) {
      out_div.innerHTML += "<br />" + txt
  }

Answer 4

更改为<br />

在IE中的pre元素中使用innerHTML插入换行符（\ n）不起作用？

4 个答案: