草庐IT

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

coder 2024-05-10 原文

我正在测试我之前读到的关于 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 仍然更快。如果有人知道为什么将它包装在一个元素中会更快，我将不胜感激......

最佳答案

提高 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. 就绪事件的简写

关于javascript - jQuery html() 表现真的很慢，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1063303/

javascriptjQuerylicodesectionperformance

有关javascript - jQuery html() 表现真的很慢的更多相关文章

  1. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  2. ruby-on-rails - 我真的需要在 Rails 中使用 csv gem 吗？ - 2

    我的问题很简单:我是否必须在使用RubyonRails的类上require'csv'？如果我打开一个railsconsole并尝试使用CSVgem它可以工作，但我必须在文件中这样做吗？ 最佳答案 CSVlibrary是ruby​​标准库的一部分；它不是gem(即第三方库)。与所有标准库(与核心库不同)一样，csv不会由ruby​​解释器自动加载。所以是的，在您的应用程序中某处您确实需要要求它:irb(main):001:0>CSVNameError:uninitializedconstantCSVfrom(irb):1from/Us

  3. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  4. ruby-on-rails - ruby 真的是一种完全面向对象的语言吗？ - 2

    Ruby是完全面向对象的语言。在ruby​​中，一切都是对象，因此属于某个类。例如5属于Objectclass1.9.3p194:001>5.class=>Fixnum1.9.3p194:002>5.class.superclass=>Integer1.9.3p194:003>5.class.superclass.superclass=>Numeric1.9.3p194:005>5.class.superclass.superclass.superclass=>Object1.9.3p194:006>5.class.superclass.superclass.superclass.su

  5. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  6. ruby - 为什么 `include` 在顶层表现不同？ - 2

    我使用以下钩子(Hook)来检查在执行includeFoo时执行包含的模块:moduleFoodefself.included(includer)putsincluderendendModule#include在模块中(通常使用它的地方)与在顶层的行为不同。在模块内部，self是模块，它是Module的一个实例.当我调用include，执行包含的模块是whatself是:moduleBarputsself#=>BarincludeFoo#=>includer:Barend在ruby​​脚本的顶层，self是main，它是Object的一个实例.当我调用include在顶层，包含的模块是

  7. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss？ - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如

  8. ruby - 使用 Selenium WebDriver 启用/禁用 javascript - 2

    出于某种原因，我必须为Firefox禁用javascript(手动，我们按照提到的步骤执行http://support.mozilla.org/en-US/kb/javascript-settings-for-interactive-web-pages#w_enabling-and-disabling-javascript)。使用Ruby的SeleniumWebDriver如何实现这一点？ 最佳答案 是的，这是可能的。而是另一种方式。您首先需要查看链接Selenium::WebDriver::Firefox::Profile#[]=

  9. ruby-on-rails - Rails 3 Cli 执行命令真的很慢吗？ - 2

    有人知道为什么我的rails3.0.7cli这么慢吗？当我运行railss或railsg时，他大约需要5秒才能真正执行命令...有什么建议吗？谢谢 最佳答案 更新:我正在将我的建议从rrails切换到rails-sh，因为前者支持REPL，而rrails不是用例。此外，当与ruby​​环境结合使用时，修补似乎确实可以提高性能变量，现在反射(reflect)在答案中。一个可能的原因可能是这个performancebuginruby每当在ruby​​代码中使用“require”时，它就会调用一些代码(更多详细信息here)。在使用Rai

  10. ruby - Watir-Webdriver 是否支持点击目标为 javascript 的链接？ - 2

    我是Ruby和Watir-Webdriver的新手。我有一套用VBScript编写的站点自动化程序，我想将其转换为Ruby/Watir，因为我现在必须支持Firefox。我发现我真的很喜欢Ruby，而且我正在研究Watir，但我已经花了一周时间试图让Webdriver显示我的登录屏幕。该站点以带有“我同意”区域的“警告屏幕”开头。用户点击我同意并显示登录屏幕。我需要单击该区域以显示登录屏幕(这是同一页面，实际上是一个表单，只是隐藏了)。我整天都在用VBScript这样做:objExplorer.Document.GetElementsByTagName("area")(0).click

随机推荐