瀏覽器支持getBoundingClientRect的寬度和高度屬性？

我剛剛發現並非常喜歡getBoundingClientRect，因爲它包含了子像素精度。這使我可以創建一致的對齊方式，即使用戶鍵入了Ctrl+或Ctrl + -。瀏覽器支持getBoundingClientRect的寬度和高度屬性？

它具有性能top，bottom，left，right，& width & height。

在互聯網上很容易找到瀏覽器支持，但對於width和height屬性尤其如此。看起來這是在事實之後添加的。它適用於Firefox，Chrome和IE10，但IE8 & IE9呢？我無法方便地測試這些。

來源

2013-07-16 George Bailey

你可以使用IE10中的開發人員將其放入IE8模式？（我不確定IE10可以做到這一點，但在IE8模式IE9可能會得到類似的東西。） – Pointy

也'寬度'不同於'右 - 左'？ – Pointy

*「使用開發人員的東西」*從歷史上看，IE中的F12工具能夠準確地反映出舊的HTML和CSS解析器，但我注意到它在舊的JavaScript解釋器上無法正確工作。 –

在IE9爲IE8：

document.body.getBoundingClientRect() 
[object] { 
    right : 2556, 
    top : 0, 
    bottom : 1195, 
    left : 0 
}

在IE9爲IE9：

document.body.getBoundingClientRect() 
[object ClientRect] { 
    bottom : 1435, 
    height : 1435, 
    left : 0, 
    right : 2544, 
    top : 0, 
    width : 2544 
}

所以，我想說的是在IE9中，沒有對IE8 ...

來源

2013-07-16 20:24:18 dandavis

IE 7也不支持寬度和高度。感謝微軟提供的非常棒的編程體驗！ – Phil

我們發現IE8中的左右是以整數運算的形式執行的，而IE9中的寬度可以是浮點數。如果您嘗試在頁面上排列兩個元素，則半個像素可能相當大。 –

瀏覽器支持getBoundingClientRect的寬度和高度屬性？

回答

相關問題