爲什麼警報會在背景更改之前出現？

所以，我最近一直努力的東西，並得到了這段代碼在我的腳本：爲什麼警報會在背景更改之前出現？

document.body.bgColor = "red"; 
alert("hello");

但在Chrome中，警告對話框彈出第一個也是唯一後，我關閉它我的身體的背景變化。在Firefox中，我得到預期的行爲，身體背景變爲紅色，然後彈出。

我知道我們不應該依賴警報和類似的瀏覽器控件，但任何人都可以告訴我這是否發生，因爲行爲不在標準中，或者是因爲我對上述代碼的同步執行的理解是錯誤的？

渲染過程具有它自己的生命週期，並且不阻止JavaScript線程。他們都獨立工作。

解決方法是「暫停」JavaScript執行以使渲染線程趕上。這可以通過一個簡單的setTimeout一套做才能0

document.body.style.backgroundColor = "red"; 

setTimeout(function() { 
    alert("hey"); 
}, 0)

注意bgColor已自2003年以來棄用的DOM Level 2 Spec。目前設置元素背景顏色的方法是通過element.style.backgroundColor。

2016-12-03 08:09:18 marvinhagemeister

謝謝。這有幫助。有一件事情讓我擔心，如果這能保證渲染將在'setTimeout（）'內的alert（）'執行之前完成？我的意思是，對於更復雜的CSS，是否有像'onStylesApplied'這樣的事件或可以嵌入到渲染過程中的事件？ –

在setTimeout調用之前，您可以調用盡可能多的樣式操作。 – marvinhagemeister

您很可能可以在彈出對話框之前強制執行背景顏色更改，方法是在打開警報之前稍等片刻，以便瀏覽器重新繪製。

setTimeout(function() { alert("hello"); }, 1);

2016-12-03 08:04:07 Hampus

的簡單的解決方法將是這樣的：

document.body.bgColor = "red"; 
setTimeout(function() { 
     window.alert('Hello There!'); 
    }, 10);

的超時值「9」在我的情況下，最小，如果我使用< 9，警報第一次出現。

2016-12-03 08:04:44

回答