訪問佈局信息是否也會導致瀏覽器重排？

我知道設置樣式屬性會導致瀏覽器重排。訪問佈局屬性時是否也可能會發生瀏覽器重排？如果是，請給出具體示例，說明爲什麼會導致瀏覽器重排？訪問佈局信息是否也會導致瀏覽器重排？

2012-09-14 Geek

這是一個軼事，但我已經看到鉻迴流元素時，只是試圖檢查開發工具中的元素。即使被檢查的元素遠不及接近/與有迴流元素有關。 – DCoder

[在DOM環境中何時發生迴流？]（http://stackoverflow.com/questions/510213/when-does-reflow-happen-in-a-dom-environment）或[哪些DOM元素屬性可以導致瀏覽器執行迴流操作]（http://stackoverflow.com/q/11616619/1048572） – Bergi

「佈局屬性」是什麼意思？ – Bergi

當然這取決於執行，但一般瀏覽器在讀取元素的屬性觸發，如果它認爲需要佈局數據重新查詢迴流（即該元素或任何一些佈局相關的屬性父元素已更改）。

您可以在這裏找到WebKit的受影響屬性列表：How (not) to trigger a layout in WebKit。結合實例更普遍的文章：Rendering: repaint, reflow/relayout, restyle

來源

2012-09-14 10:42:48

獲取屬性可能（見下文）但改變屬性會。樣式相關的屬性，例如ele.width。位置屬性（如iframe或img標籤的src）將會。

另請注意，附加事件監聽器（on*=...,addEventListener(*,...)等）會導致迴流。這是由於事件捕獲從外部大多數父元素到src元素的方式，並通過父元素鏈從src元素中冒出。

此外，現代瀏覽器（例如chrome）會延遲更新GUI，除非查看指定的頁面。由於瀏覽器確認頁面正確顯示，頁面變爲活動狀態時會導致重排。這個延遲/隊列可以使屬性看起來好像它們引起迴流，但事實上，瀏覽器確保它正確顯示。

來源

2012-09-14 10:09:56 SReject

你能解釋爲什麼一個事件監聽器會導致迴流？我不能相信這一點。 – Bergi

也很好奇知道，從來沒有聽說過... –

依賴於瀏覽器，當附加事件監聽器時，瀏覽器從最外層的元素向內移動到有問題的元素（EIQ）。因爲它這樣做，瀏覽器需要檢查定位，寬度等，正在正確顯示，所以像懸停，點擊，選擇等事件發射，因爲他們應該。我無法真正解釋原因，但是一個例子是點擊EIQ w /圓角。如果角落（四捨五入）通常被點擊，該事件不應該觸發。 – SReject

如果您不更改CSS屬性，只訪問它，，該頁面將不需要重新渲染。

來源

2012-09-14 10:10:09 Abraham

有許多非CSS屬性會導致迴流，甚至有一些CSS屬性不會。 – Bergi

嗯，我的意思是不改變財產，因爲只有價值。我知道設置屬性通常會導致迴流。 – Abraham

哦，當然，獲得CSS樣式永遠不會導致迴流。但獲得計算風格可以做到。 – Bergi

我知道這是遲到了的遊戲，這在某種程度上，如果你讀其他人發佈已鏈接，你可以找到答案，但它值得在此明確聲明：

瀏覽器的任務是給你當前值，所以作爲一般規則，它是將回流和重繪，以確保你有什麼是什麼值現在。我發現以這種方式考慮它會有所幫助 - 無論您在網頁上詢問任何元素的位置或大小，都可以假定您將引起迴流/重繪。不，它不是100％總是真實的，但它足夠接近100％，如果你要求頂部，左側，底部，右側，高度，寬度或任何影響這些測量的事物（例如比例，旋轉等），你將會導致R/R。這是我可以給你的具體答案。

再次，這是不是在任何時候都100％正確的，但我覺得，如果你認爲這樣的說法，它會在時間的98％，幫助它是真實的，不會傷害儘可能多對於其他2％，因爲它有助於98.

來源

2013-08-07 15:12:38 borbulon

訪問佈局信息是否也會導致瀏覽器重排？

回答

相關問題