Question

我最初使用PHP来循环一堆案例规则，并根据单元格的值将CSS样式类应用于各个TD单元格。 PHP表现非常出色，页面加载几乎是即时的。我想尝试使用JavaScript，因为每个人都说“如果你能用JavaScript做的话，不要用PHP做点什么”。

我现在正在使用.each（）循环 - 但问题是加载并锁定浏览器要求停止运行脚本需要19.6秒 - 在Core i7 4790k w / 16 GB RAM上！可怕！

这是使用服务器端循环比JavaScript循环更有效的情况吗？我应该用PHP或JavaScript / jQuery进行循环吗？

这是jQuery代码 - 如果它有任何明显的错误：

function inRange(value, low, high) {
if (value >= low && value <= high) { return value; }
else { return !value; }
}

$(document).ready(function() {

    $('.jsColorTemp').each(function() {
        var tValue = $(this).contents().filter(function() { return this.nodeType === 3; }).text();
        switch(tValue) {
            case inRange(tValue, -999, -75): $(this).switchClass('jsColorTemp', 'C6TB75', 0); break;
            case inRange(tValue, -74, -70): $(this).switchClass('jsColorTemp', 'C6TB70B74', 0); break;
            case inRange(tValue, -69, -65): $(this).switchClass('jsColorTemp', 'C6TB65B69', 0); break;
            case inRange(tValue, -64, -60): $(this).switchClass('jsColorTemp', 'C6TB60B64', 0); break;
            case inRange(tValue, -59, -55): $(this).switchClass('jsColorTemp', 'C6TB55B59', 0); break;
            case inRange(tValue, -54, -50): $(this).switchClass('jsColorTemp', 'C6TB50B54', 0); break;
            case inRange(tValue, -49, -45): $(this).switchClass('jsColorTemp', 'C6TB45B49', 0); break;
            case inRange(tValue, -44, -40): $(this).switchClass('jsColorTemp', 'C6TB40B44', 0); break;
            case inRange(tValue, -39, -35): $(this).switchClass('jsColorTemp', 'C6TB35B39', 0); break;
            case inRange(tValue, -34, -30): $(this).switchClass('jsColorTemp', 'C6TB30B34', 0); break;
            case inRange(tValue, -29, -25): $(this).switchClass('jsColorTemp', 'C6TB25B29', 0); break;
            case inRange(tValue, -24, -20): $(this).switchClass('jsColorTemp', 'C6TB20B24', 0); break;
            case inRange(tValue, -19, -15): $(this).switchClass('jsColorTemp', 'C6TB15B19', 0); break;
            case inRange(tValue, -14, -10): $(this).switchClass('jsColorTemp', 'C6TB10B14', 0); break;
            case inRange(tValue, -9, -5): $(this).switchClass('jsColorTemp', 'C6TB05B09', 0); break;
            case inRange(tValue, -4, 0): $(this).switchClass('jsColorTemp', 'C6T000B04', 0); break;
            case inRange(tValue, 1, 4): $(this).switchClass('jsColorTemp', 'C6T004001', 0); break;
            case inRange(tValue, 5, 9): $(this).switchClass('jsColorTemp', 'C6T009005', 0); break;
            case inRange(tValue, 10, 14): $(this).switchClass('jsColorTemp', 'C6T014010', 0); break;
            case inRange(tValue, 15, 19): $(this).switchClass('jsColorTemp', 'C6T019015', 0); break;
            case inRange(tValue, 20, 24): $(this).switchClass('jsColorTemp', 'C6T024020', 0); break;
            case inRange(tValue, 25, 29): $(this).switchClass('jsColorTemp', 'C6T029025', 0); break;
            case inRange(tValue, 30, 32): $(this).switchClass('jsColorTemp', 'C6T032030', 0); break;
            case inRange(tValue, 33, 34): $(this).switchClass('jsColorTemp', 'C6T034033', 0); break;
            case inRange(tValue, 35, 39): $(this).switchClass('jsColorTemp', 'C6T039035', 0); break;
            case inRange(tValue, 40, 44): $(this).switchClass('jsColorTemp', 'C6T044040', 0); break;
            case inRange(tValue, 45, 49): $(this).switchClass('jsColorTemp', 'C6T049045', 0); break;
            case inRange(tValue, 50, 54): $(this).switchClass('jsColorTemp', 'C6T054050', 0); break;
            case inRange(tValue, 55, 59): $(this).switchClass('jsColorTemp', 'C6T059055', 0); break;
            case inRange(tValue, 60, 64): $(this).switchClass('jsColorTemp', 'C6T064060', 0); break;
            case inRange(tValue, 65, 69): $(this).switchClass('jsColorTemp', 'C6T069065', 0); break;
            case inRange(tValue, 70, 74): $(this).switchClass('jsColorTemp', 'C6T074070', 0); break;
            case inRange(tValue, 75, 79): $(this).switchClass('jsColorTemp', 'C6T079075', 0); break;
            case inRange(tValue, 80, 84): $(this).switchClass('jsColorTemp', 'C6T084080', 0); break;
            case inRange(tValue, 85, 89): $(this).switchClass('jsColorTemp', 'C6T089085', 0); break;
            case inRange(tValue, 90, 94): $(this).switchClass('jsColorTemp', 'C6T094090', 0); break;
            case inRange(tValue, 95, 99): $(this).switchClass('jsColorTemp', 'C6T099095', 0); break;
            case inRange(tValue, 100, 104): $(this).switchClass('jsColorTemp', 'C6T104100', 0); break;
            case inRange(tValue, 105, 109): $(this).switchClass('jsColorTemp', 'C6T109105', 0); break;
            case inRange(tValue, 110, 114): $(this).switchClass('jsColorTemp', 'C6T114110', 0); break;
            case inRange(tValue, 115, 999): $(this).switchClass('jsColorTemp', 'C6T115', 0); break;
        }
    });

});

Answer 1

已经修好了。所以jQuery＆＃34; switchClass（）＆＃34;即使您指定0秒动画持续时间，函数也会非常慢。使用＆＃34; toggleClass（）＆＃34;工作得更快。

PHP函数与jQuery.each（）

1 个答案: