仅附加新数据

时间:2016-05-27 19:54:42

标签: javascript jquery

我正在尝试创建一个日志解析器,每10秒更新一次日志。它主要是功能性的,但是当我尝试更新它时,它只是再次附加整个日志,而不仅仅是新数据。

我的Javascript:

$(document).ready(function() {

var data;
var lines;

$.ajax({
 async: false,
 type: 'GET',
 url: 'test.log',
 success: function(log) {\
    data = log;
    lines = data.split("\n");
    console.log("Received log");
 }
});

function updateLog()
{
    $.ajax({
     async: false,
     type: 'GET',
     url: 'test.log',
     success: function(log) {
        data = log.replace(data, "");
        lines = log.split("\n");

        console.log("Received log");
        }
    });

    $.each(lines, function(n, elem) 
    {
       $('#text').append('<div>' + elem + '</div>');
    });
}



$.each(lines, function(n, elem) 
{
   $('#text').append('<div>' + elem + '</div>');
});


   setInterval(function(){updateLog();}, 10000);
}); 

示例test.log内容:

Hello
How are you?

但不是只添加潜在的新行,它只是复制整个事物,即使我认为它不应该因为replace而发生,因为data应该采用旧的''并在新数据中将其更改为performSegueWithIdentifier("yourSegueIDGoesHere", sender: self)(仅留下新行)。

2 个答案:

答案 0 :(得分:1)

在我看来,您只将上次请求的新部分保存到data,因此您实际上只是在上次用空字符串更新日志时替换了新的日志部分。此外,您没有使用data,而是使用log(这是完整的日志)来计算lines,并将lines中的所有行追加到您的div。

我认为这样的事情应该有效:

$(document).ready(function() {
    var processed_data = '';
    function updateLog() {
        $.ajax({
            async: false,
            type: 'GET',
            url: 'test.log',
            success: function(log) {
                var new_data = log.replace(processed_data, '');
                processed_data = log;
                console.log("Received log");
                var lines = new_data.split('\n');
                $.each(lines, function(n, elem) {
                   $('#text').append('<div>' + elem + '</div>');
                });
            }
        });
    }
    updateLog();
    setInterval(function(){updateLog();}, 10000);
}); 

请注意,我还通过在加载时调用updateLog()而不是复制其内容来摆脱示例中的一些代码重复。

仅跟踪已打印的日志部分的长度可能更有效。像这样:

$(document).ready(function() {
    var processed_data_length = 0;
    function updateLog() {
        $.ajax({
            async: false,
            type: 'GET',
            url: 'test.log',
            success: function(log) {
                var new_data = log.substring(processed_data_length, log.length);
                processed_data_length = log.length;
                console.log("Received log");

                $.each(lines, function(n, elem) {
                   $('#text').append('<div>' + elem + '</div>');
                });
            }
        });
    }
    updateLog();
    setInterval(function(){updateLog();}, 10000);
}); 

答案 1 :(得分:0)

字符串是不可变的,因此.replace()调用不会更新日志变量。你的ajax应该看起来像:

$.ajax({
     async: false,
     type: 'GET',
     url: 'test.log',
     success: function(log) {
        data = log.replace(data, "");
        lines = data.split("\n");

        console.log("Received log");
        }
    });