Как я могу изменить фон на веб-странице дважды с помощью js - PullRequest
0 голосов
/ 27 июня 2019

функция должна изменить фон на красный и синий с 1 секундой между двумя операциями, но когда я ее запускаю, я обнаруживаю, что первое изменение не появляется на странице

я помещаю "сон""функционирую так, как я думал 2 изменения происходят одновременно

   function changeBackGround()
   {
   document.body.style.backgroundColor = "red"; 
   sleep(1000); 
   document.body.style.backgroundColor = "blue";

   }


 function sleep(milliseconds) {
   var start = new Date().getTime();
   for (var i = 0; i < 1e7; i++)
   {
    if ((new Date().getTime() - start) > milliseconds) 
     {
     break;
     }
   }
  } 

Я ожидаю, что фон страницы сначала должен быть красным, а через 1 секунду он станет синим

Ответы [ 2 ]

0 голосов
/ 27 июня 2019

вы можете определить функцию для принятия цвета в качестве аргумента, например:

function changeBackGround(color) {
   document.body.style.backgroundColor = color; 
}

и вы можете использовать setTimeout для выполнения функции после заданного периода в миллисекундах

window.onload = function() {
  changeBackGround('red');
  setTimeout(function() {
    changeBackGround('blue');
  }, 1000);
}
0 голосов
/ 27 июня 2019

Ваша доморощенная функция sleep блокирует цикл событий в цикле занятости. Это не позволяет браузеру перекрашивать страницу, поэтому, пока DOM обновлен, фон не отображается на отображаемой странице.

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

...