javascript - jQuery html() 表现真的很慢

Question

我正在测试我之前读到的关于 Math.random() 有多随机的东西确实如此，并且想要显示 10000 个数字，这些数字应该是 0 到 10000000 之间的随机数。

为了查看测试，我选择了将随机数数组加入到带有 <br> 的字符串中每个整数之间。然后我就做了 $("#"+elm).html(randomNumberString);这真的很慢。我只是认为这是随机数的生成和排序到数组中。但是当我开始在我的代码中放置计时器时，我发现是输出让一切变慢了。

就像我做的测试一样document.getElementById(elm).innerHTML = randomNumberString;

jQuery.html():2500 毫秒 getElementById.innerHTML:170 毫秒

我在所有 5 种浏览器上都试过了，所有浏览器中的数字都非常接近……我在这种情况下使用 jQuery 是不是错了？我还尝试在计时器开始之前追加和获取元素，所以我可以简单地做 $(elm).html() ，但这没有帮助。这似乎是实际的 html()使一切变慢的功能..？

编辑我最终这样做了:

randomStringNumber = "<div>" + randomStringNumber + "</div>";

现在整个事情运行得更快了: jQuery.html():120 毫秒 getElementById.innerHTML:80 毫秒

不过，使用 oldschool html 仍然更快。如果有人知道为什么将它包装在一个元素中会更快，我将不胜感激......

Answer 1

提高 jquery 使用的 25 个技巧

http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips.aspx

http://acsenthil.wordpress.com/2011/07/04/improve-your-jquery-25-excellent-tips/

1. 从 Google 代码加载框架
2. 使用备忘单
3. 合并所有脚本并缩小它们
4. 使用 Firebug 出色的控制台日志记录工具
5. 通过缓存将选择操作保持在最低限度
6. 尽量减少 DOM 操作
7. 在进行任何类型的 DOM 插入时将所有内容包装在一个元素中
8. 尽可能使用 ID 而不是类
9. 给你的选择器一个上下文
10. 正确使用链接
11. 学会正确使用动画
12. 了解事件委托(delegate)
13. 使用类来存储状态
14. 更好的是，使用 jQuery 的内部 data() 方法来存储状态
15. 编写自己的选择器
16. 简化您的 HTML 并在页面加载后修改它
17. 延迟加载内容以获得速度和 SEO 优势
18. 使用 jQuery 的实用函数
19. 使用其他框架时使用noconflict重命名jquery对象
20. 如何判断图片何时加载
21. 始终使用最新版本
22. 如何检查元素是否存在
23. 将 JS 类添加到您的 HTML 属性
24. 返回“false”以防止默认行为
25. 就绪事件的简写