我有一个使用 AJAX 从服务器检索消息的 HTML 页面。我通过设置其 innerHTML 属性将这些消息附加到 a 中。
这在文本量较小时工作正常，但随着文本量的增加，它会导致 Firefox 使用所有可用的 CPU，并且消息速度变慢以致于爬行。我不能使用文本框，因为我希望某些文本以颜色突出显示或使用其他 HTML 格式。有没有更快的方法来执行此操作而不会导致浏览器锁定？
我也尝试过使用 jQuery，但从我读到的内容来看，设置 .innerHTML 比它的 .html() 函数更快，而且根据我自己的经验，情况似乎也是如此。
编辑:感知性能不是问题 - 消息在返回时已经被写入(使用 Comet)。问题是浏览器开始锁定。内容量不是很大——400-500 行似乎就可以了。该 div 中没有 div。整件事都在一张 table 里，但希望这无关紧要。
最佳答案
您明确表示您正在附加意味着您将其附加到同一个父级。你在做类似的事情吗:
myElem.innerHTML += newMessage;
或
myElem.innerHTML = myElem.innerHTML + newMessage;
因为这是非常低效的(参见这个基准:http://jsben.ch/#/Nly0s)。它会导致浏览器首先执行一个非常非常大的字符串连接(这从来都不好)，但更糟糕的是必须重新解析插入并呈现您之前附加的所有内容。比这更好的方法是创建一个新的 div 对象，使用 innerHTML 放入消息，然后调用 dom 方法 appendChild 将消息插入新创建的 div。然后浏览器只需插入并呈现新消息。
关于javascript - 使用 JavaScript 将 HTML 内容附加到 div 的最快方法，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1387433/