Question

我有一个包含数十列和数百行的HTML表。我想根据另一列的值更改一个表格单元格（TD）的值。（我需要为三对列做这件事）。由于我无法控制数据源，因此某些浏览器的列顺序可能会有所不同。我采取的步骤：

for(i=0;i<3;i++){
    for(j=0;j<2;j++){
        if(!!(JQ("div[DisplayName='"+updateViewerFields[i][j]+"']"))){
            updateViewer[i][j]=(JQ(this).find(JQ("div[DisplayName='"+updateViewerFields[i][j]+"']")).parent().index())+1;
    }}}

这将三个字段的索引位置存储在一个数组中 - ＆＃39; UpdateViewer＆＃39;。这三个字段的名称来自＆＃39; UpdateViewerFields＆＃39;。

var updateViewerFields=[["Phase 1","Phase 1 - Comments"],["Phase 2","Phase 2 - Comments"],["Phase 3","Phase 3 - Comments"]];
var updateViewer=[[0,0],[0,0],[0,0]];

现在，我遍历应用格式的每一行：

       JQ(this).find("tr").each(function(){
            //update data as per matrix
            for(i=0;i<3;i++){
               if(0!=updateViewer[i][0]){
                var currentPhaseElement= JQ(this).find(JQ('td:nth-child('+updateViewer[i][0]+')'));
              JQ(currentPhaseElement).attr('title',JQ(this).find(JQ('td:nth-child('+updateViewer[i][1]+')')).html());
//other stuff
    }
    }}

代码运行没有错误。但是，IE中的代码太慢了。我甚至在使用IE时会收到警告 -

'A script on this page is causing Internet Explorer to run slowly. If it continues to run, your computer may become unresponsive. Do you want to abort the script?'

但是，相同的代码在Chrome中运行顺畅。如何改进代码以在IE中以更快的响应时间实现相同的效果？ PS＆GT;请建议仅对代码进行更改。

这是一个小提琴表示：http://jsfiddle.net/QZs2G/7/

UPDATE：这里的代码中的JQ是一个在noconflict模式下运行jquery的变量。

var JQ=jquery.noconflict();

小提琴使用无处不在的$ sign

Answer 1

以下是我在两天内发现的一些优化措施：

IE处理Javascript比Chrome慢。另外，Javascript＆＃34; for 环路＆＃34;比Jquery快＃34;每个＆＃34;。如果需要处理大量数据，那么最好使用＆＃34; for＆＃34;进行所有操作。循环而不是使用Jquery的快捷方式＆＃34;每个＆＃34; - jsperf.com/jquery-each-vs-for-loop/4
DOM操作非常昂贵。它需要保持一个最小。尝试一次性完成所有DOM更改。但是，这可能不是在所有情况下都是可能的。
使用Jquery操作DOM需要做得很仔细。如果需要进行大量更改，您也可以创建元素的副本，对其进行编辑，然后将其添加到DOM中。 http://api.jquery.com/clone/

http://api.jquery.com/replacewith/
文档片段 - 而不是在DOM中添加小块步骤，它更好地创建一个文档片段，然后添加它一次性到DOM。 https://developer.mozilla.org/en-US/docs/Web/API/document.createDocumentFragment

您可以在本文中阅读更多内容。 http://www.artzstudio.com/2009/04/jquery-performance-rules/

这里提到的步骤帮助我显着减少了页面的加载时间。我希望这些实践也能帮助其他HTML / Javascript开发人员。

如何根据另一个单元格中的值更改html表格单元格中的文本

1 个答案: