Javascript получает время загрузки каждого источника iframe

Question

У меня есть код, который читает URL-адреса из текстового файла и помещает их в iframe один за другим. Я хочу рассчитать время загрузки каждой страницы. Я делаю это, отмечая время до того, как iframe начнет загружать URL-адрес, и отметьте время, которое он занимает. После загрузки минус Перед загрузкой дается время загрузки каждой страницы.

$.get("text.txt", function (data) { 
     var array = data.split(/\r\n|\r|\n/) 
     var beforeLoad = (new Date()).getTime();  
     var loadTimes = []; 
    $('#1').on('load', function() { 
     loadTimes.push((new Date()).getTime());   
     $('#1').attr('src', array.pop()); 
      $.each(loadTimes, function (index, value) {    
       var result = (value - beforeLoad)/1000;  
       $("#loadingtime" + index).html(result); 
      }); 
    }).attr('src', array.pop()); 
}); 

Проблема здесь - до времени загрузки. Я не могу понять, как отметить время, прежде чем КАЖДЫЙ URL начнет загружаться. В приведенном выше коде значение beforeload - это значение времени перед загрузкой всех источников, где я хочу, чтобы он менялся каждый раз, когда новый источник попадает в iframe. Любые предложения, как я это делаю?

Редактировать: исправлено!

$.get("imones.txt", function (data) { 
     var array = data.split(/\r\n|\r|\n/) 
     var beforeLoad = (new Date()).getTime();  
     var loadTimes = []; 
      var beforeTimes = [];    
     $('#frame_id').on('load', function() {         
      beforeTimes.push(beforeLoad); 
      loadTimes.push((new Date()).getTime()); 
      $('#frame_id').attr('src', array.pop()); 
       $.each(loadTimes, function (index, value) { 
        var result = (value - beforeTimes[index])/1000; 
         if (result < 0) { 
          result = result * (-1); 
         } 
        $("#loadingtime" + index).html(result); 
        beforeLoad = value; 
       }); 
     }).attr('src', array.pop()); 
    }); 

Не уверен, что я там делал, но это работает для меня, и теперь мы проанализируем его. Я сделал массив, который сохраняет правильные значения перед временем загрузки каждой страницы.

Answer 1

var loadTimes = {}; 
$('#1').data('time', (new Date()).getTime()).on('load', function() { 
    var $this = $(this), time = (new Date()).getTime(); 
    loadTimes[$this.attr('src')] = time - $this.data('time'); 
    $this.data('time', time); 
    if (array.length == 0) { 
    //end of load loadTimes contents with time of load each url 
    } else $this.attr('src', array.pop()); 
}).attr('src', array.pop()); 

Answer 2

Временно храните новое время beforeLoad временно, вычисляйте время последней загрузки, копируйте новое время beforeLoad.

$.get("text.txt", function (data) { 
    var array = data.split(/\r\n|\r|\n/); 
    var beforeLoad = (new Date()).getTime();  
    var loadTimes = []; 

    $('#1').on('load', function() { 

    var nextBeforeLoad = (new Date()).getTime(); 
    loadTimes.push(nextBeforeLoad);  

    $.each(loadTimes, function (index, value) {    
     var result = (value - beforeLoad)/1000;  
     $("#loadingtime" + index).html(result); 
     }); 

    beforeLoad = nextBeforeLoad; 
    $('#1').attr('src', array.pop()); 

    }).attr('src', array.pop()); 
}); 

Answer 3

Попробуйте

var links = [ 
    'http://google.com', 
    'http://yahoo.com' 
] 

$(links).each(function (i) { 
    var iframe = document.createElement('iframe'); 
    iframe.setAttribute('t1', (new Date()).getTime()); 
    iframe.setAttribute('src', links[i]); 
    iframe.onload = function() { 
     var t2 = (new Date()).getTime(); 
     console.log('Load Time: ' + (t2 - parseInt(this.getAttribute('t1')))); 
    } 
    document.body.appendChild(iframe); 
}); 

Answer 4

$.get("text.txt", function (data) { 
     var array = data.split(/\r\n|\r|\n/) 
     var beforeLoad = (new Date()).getTime();  
     var loadTimes = []; 
      var beforeTimes = [];    
     $('#frame_id').on('load', function() {         
      beforeTimes.push(beforeLoad); 
      loadTimes.push((new Date()).getTime()); 
      $('#frame_id').attr('src', array.pop()); 
       $.each(loadTimes, function (index, value) { 
        var result = (value - beforeTimes[index])/1000; 
         if (result < 0) { 
          result = result * (-1); 
         } 
        $("#loadingtime" + index).html(result); 
        beforeLoad = value; 
       }); 
     }).attr('src', array.pop()); 
    });