使用jquery迭代超过500列和15列的表 [英] Iterating through table with rows more than 500 and 15 columns using jquery

问题描述

这是挑战;
如何迭代（+更改元素属性，而这样做）在使用jquery / Javascript的500行以上的表上？增加的挑战是浏览器是IE8。

我尝试使用for循环和$ .each超过表...我得到的东西工作，但它的减速那个肮脏的IE和扔脚本错误（错误：你想继续这个脚本吗？可能会减慢你的电脑.bla bla bla）。

问题不是了解如何迭代和更改各个列的属性，但如何优化此过程。

非常感谢任何帮助。

解决方案

你正在执行一个时间紧迫的任务，不要使用jQuery。每个 $（'。classname'）执行至少20个jQuery行，特别是在IE8的情况下，也是大量的本地遍历文档。

在IE8中执行的脚本行有一个限制。默认情况下，它执行一百万行，然后询问用户是否要继续执行该脚本。这个限制是由注册管理机构控制的，但是在网络应用程序的情况下，增加网络的价值并不有用。

在IE8中，渲染速度也是一个问题。 p>

• 一般使用最小样式


• 尽量避免设置 innerHTML / innerText ，使用 createElement（）
  和/或 createTextNode（）和 appendChild（）和/或 insertBefore（）
  


• 避免内联样式，更改类名称，甚至使用直接的CSS规则操作。


• 使用时尽可能缓存元素 getElementsBy / Tag / Class / Name（）。


• 使用cahched table.rows 和 table.rows [n] .cells 可能的集合。


• 考虑只显示一部分表格一个时间，它使渲染更快。

Here is the challenge; how can I iterate (+change the elements properties,while doing so) over table consisting more than 500 rows using jquery/Javascript? The added challenge is that the browser is IE8.

I tried using for loop and $.each over the table... I got the thing working, but its slowing down the damn IE and throwing script error(Error: Do you want to continue this script? It may slow down your computer..bla bla bla).

The problem is not to know how to iterate and change the properties of individual columns, but how to optimize this process.

Any help is much appreciated.

解决方案

In general, if you're executing a time-critical task, don't use jQuery. Every $('.classname') executes at least 20 jQuery lines, and especially in case of IE8, also a ton of native iterating through the document.

There's a limit for script lines executed in IE8. By default it executes one million lines, then user is asked, if he wants to continue the script. This limit is controlled by registry, but in case of a web app, it's not usefull to increase the value ofcourse.

In IE8 rendering speed is also an issue.

• Use minimal styling in general
• Try to avoid setting innerHTML / innerText, use createElement() and/or createTextNode() and appendChild() and/or insertBefore() instead.
• Avoid inline styles, rather change class names, or even use direct CSS rule manipulation instead.
• Cache elements as much as possible when using getElementsBy/Tag/Class/Name().
• Use cahched table.rows and table.rows[n].cells collections where ever possible.
• Consider to show only a part of the table at a time, it makes rendering faster.

这篇关于使用jquery迭代超过500列和15列的表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！