我有一個相當長的運行JavaScript代碼添加一個新的「div」元素到文檔。它看起來像在IE中,只有在腳本完成後纔會呈現此更改,而FF中則不是這種情況。IE瀏覽器不會呈現更改,而JavaScript腳本運行
任何想法如何使它工作?這個腳本實際上應該是永遠運行的,一種「主循環」。
我有一個相當長的運行JavaScript代碼添加一個新的「div」元素到文檔。它看起來像在IE中,只有在腳本完成後纔會呈現此更改,而FF中則不是這種情況。IE瀏覽器不會呈現更改,而JavaScript腳本運行
任何想法如何使它工作?這個腳本實際上應該是永遠運行的,一種「主循環」。
我會避免使用永久運行的腳本。如果您需要定期執行重複計劃,請使用Window.SetTimout/SetInterval。否則,請使用事件。有很多JS框架,比如Mootools,可以很容易地實現你自己的自定義事件,這將消除對「主循環」的需求。
不要使用不斷運行的腳本,JavaScript是不是意味着這樣的使用。使用基於事件的代碼或基於調度程序的代碼。我很確定,如果你有一個持續運行的腳本,你會觸發一些「瀏覽器上的某些腳本從一些瀏覽器中花費異常長的時間來運行」類型的彈出窗口。這不應該是預期的行爲。
這個腳本實際上應該是永遠運行,一種「主循環」。
你不能在JavaScript中這樣做。在控制執行線程的同時,瀏覽器無法執行任何操作,例如檢查點擊。在這種狀態下,瀏覽器無響應,並且可能看起來已經崩潰。最終大多數瀏覽器都會彈出一個警告,提示該腳本播放不好,並給用戶一個按鈕,以便不經意間將其關閉。
取而代之,您必須像平常一樣將控制權返回給瀏覽器,並要求它在稍後使用window.setTimeout(function, delay)
作爲一次性回調或window.setInterval(function, period)
以便每隔一段時間保持回撥。您希望通過調用維護的任何狀態都必須存儲在全局變量或實例變量中。
此行爲的原因是Internet Explorer重新繪製DOM上窗口更改的方式;換句話說,這是由於reflow。
除非我弄錯了,否則IE會排隊重排任務,並在腳本線程執行完畢後對其執行操作。如果您編寫的代碼永不停止線程,則永遠不會發生重排,並且您永遠不會看到DOM中的更改。
其他人建議的替代方法 - 使用window.setTimeout()和window.setInterval()是可行的,並且將有助於解決由於瀏覽器可用於執行重排任務的短暫暫停而導致的問題。
你會發現這個related SO question on when reflow occurs是有用的。
不過,有一個「主循環」或它根本不應該工作是不好的做法? P.S.我有一個非常簡單和非常具體的案例,使用循環而不是基於任何事件的框架實現起來要簡單得多。這就像循環中的5行代碼,至少有幾十個事件... – Demiurg 2009-09-25 18:14:38
據我所知,它不會工作。腳本引擎還不是多線程的......它們與頁面同時運行。目前正在做一些工作來支持網絡線程,但速度很慢,並且可能要經過足夠多的時間才能實現。這也是一種不好的做法。瀏覽器是主循環,你不應該試圖創建自己的。您應該對由頁面內容觸發的事件做出響應。 – jrista 2009-09-25 18:17:35
@Demiurg - 正如你發現的那樣,它在一些JS引擎中不起作用。切換到超時很容易,但是...只要改變'while(true){/ * code * /;例如,''to'(function loop(){/ * code * /; window.setTimeout(loop,100);})();' – 2009-09-25 18:21:19