jQuery更改CSS優先級？

在這個例子中：jQuery更改CSS優先級？

<div class="test">Lorem Ipsum </div> 
<div class="test">Lorem Ipsum </div> 
<div class="test">Lorem Ipsum </div> 

<button onclick="test();"> click</button> 

function test() 
{ 
    $('.test').css("color", "#0f0"); 

    for(i=0; i<=1000000000; i++) 
    { 

    } 
}

https://jsfiddle.net/t741kz5a/2/

爲什麼顏色前的循環運行發生變化？我怎樣才能使它順序工作？

來源

2015-11-25 user2971916

只有當不在功能中時，瀏覽器纔會更新。所以它只會在退出函數時更新。

你將不得不調用循環異步，所以你先退出函數，然後繼續。直到腳本已與處理器的當前剔完

function test() 
{ 
    $('.test').css("color", "#0f0"); 

    setTimeout(function(){ 
     for(i=0; i<=1000000000; i++) 
     { 

     } 
    }, 1); // in some cases you might have to give it more then just 1 millisecond 
}

force DOM redraw with javascript on demand

來源

2015-11-25 23:35:36 CoderPi

好吧，那麼如何在此函數中調用之前更新CSS？ – user2971916

您必須將其稱爲異步，請參閱編輯 – CoderPi

答案接受？ – CoderPi

瀏覽器不會重新呈現在屏幕上。 For-Loop在給出任何視覺反饋之前嘮叨處理器完成其線程。

但記住的JavaScript的DOM 實際酒店被之前改變for循環在你的榜樣，所以查詢它直接之後將顯示它是綠色的了。

$('.test').css("color", "#0f0"); 

console.log($('.test').css("color")); // rgb(0, 255, 0); 

for (var i = 0; i < 1000000000; i++) { };

在大多數使用情況下，這是可以接受的，不應該影響您的應用程序。

爲了簡化：這不是說你的元素對象在循環之前沒有被設置爲它的'顏色;這是瀏覽器尚未對這種變化做出直觀迴應。

來源

2015-11-26 01:09:53 shennan

jQuery更改CSS優先級？

回答

相關問題