Принудительно перерисовать элемент

641

24 ноября 2016, 10:22

Здравствуйте! Есть задача: по мере работы программы, выводить промежуточное состояние в таблицу. Для этого есть примерно такой код:

var table = document.getElementById('table'); 
 
function wait(ms) 
{ 
  var time = new Date().getTime(); 
 
  while(new Date() - time <= ms){} 
} 
 
function run() 
{ 
  for(var i=0; i<10; i++) 
  { 
    var l = document.createElement('tr'); 
    var e = document.createElement('td'); 
    e.innerText = String(i); 
    l.appendChild(e); 
    table.appendChild(l); 
    wait(100); 
  } 
}

<table id = table> 
</table> 
<input type="button" value="run" onclick="run()">

При этом, вся информация появляется, но только после завершения работы функции. Как сделать так, что бы текст появлялся в тот момент, когда он добавляется в коде?

Answer 1

function run() 
{ 
  var table = document.getElementById('table'); 
  var i = 0; 
 
  add(); 
 
  function add() { 
    var l = document.createElement('tr'); 
    var e = document.createElement('td'); 
    e.innerText = String(i); 
    l.appendChild(e); 
    table.appendChild(l); 
    if (i < 10) { 
      i++; 
      setTimeout(add, 100); 
    } 
  } 
}

<table id = table> 
</table> 
<input type="button" value="run" onclick="run()">

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Взять длину length коллекции после работы директивы ng-repeat

Здравствуйте! Вот такая вот заминка получается, директива ng-repeat выводит в список.

439

javascript

Код зависает на функции JS

Мой парсер падает на этой функции, ошибок не выводится, соответственно, он просто "думает" и не выводит ничего в консоль. .

440

javascript

Подправить JS код

Есть JS код который обрабатывает результаты теста(найден на просторах интернета), но он работает если в тесте 5 вопросов. Как сделать чтобы...

529

javascript

Обработка POST запроса

Есть POST запрос на yandex. translate ([URL="https://tech.

538