Question

加载和解析日志文件的最佳方式（在性能方面） - 为所有“错误”实例着色（在HTML中）？

<div class="mydiv"></div>

 $.get(path, function(data) {

    var lines = $(data.toString().split(/\n/));

    for (var i = 0, len = lines.length; i < len; i++) {

        if (lines[i].indexOf("error") >= 0){  

            lines[i]=lines[i].replace("error", "<span     class='error'>error</span>");                             
                     $(".mydiv").append(lines[i]);                                  

            }
 })

.error {    
    background-color:red ;      
}

Answer 1

查看How to replace all dots in a string using JavaScript，其中为字符串创建了replaceAll方法。它似乎具有很好的性能“比使用正则表达式更快”并且我已经使用它并且它工作得很好。如果不是问题，您也可以删除函数中的toLowerCase并提高性能。

来自Fagner Brack How to replace all dots in a string using JavaScript

/**
 * ReplaceAll by Fagner Brack (MIT Licensed)
 * Replaces all occurrences of a substring in a string
 */
String.prototype.replaceAll = function( token, newToken, ignoreCase ) {
    var _token;
    var str = this + "";
    var i = -1;

    if ( typeof token === "string" ) {

        if ( ignoreCase ) {

            _token = token.toLowerCase();

            while( (
                i = str.toLowerCase().indexOf(
                    token, i >= 0 ? i + newToken.length : 0
                ) ) !== -1
            ) {
                str = str.substring( 0, i ) +
                    newToken +
                    str.substring( i + token.length );
            }

        } else {
            return this.split( token ).join( newToken );
        }

    }
return str;
};

alert('okay.this.is.a.string'.replaceAll('.', ' '));

所以对于你的代码，我会使用类似的东西

$.get(path, function(data) {
    var strData = data.toString();
    strData.replaceAll("error", "<span class='error'>error</span>");    
    $(".mydiv").append($(strData));
 })

修改

根据Sergey Kochetov的建议，.replace明显更快。所以这将是一种更快的方法。

$.get(path, function(data) { var strData = data.toString(); strData.replace(/error/gi, "<span class='error'>error</span>"); $(".mydiv").append($(strData)); })

Answer 2

最好一次追加所有行：

for (...){
...
}
$(".mydiv").append(lines.join(''));

JQuery加载和解析文件

2 个答案: