鍍金池/ 問答/HTML/ 如何解釋IE下這兩個bug的原因

如何解釋IE下這兩個bug的原因

IE7-瀏覽器在offsetTop屬性的處理上存在bug:

【1】若父級設置position: relative,則在IE7-瀏覽器下,offsetTop值為offsetParent元素的paddingBottom值

<div id="out" style="padding: 5px;position: relative;">
    <div id="test" style="width:100px; height:100px; margin:10px;"></div>        
</div>
<script>
    //其他瀏覽器返回15(5+10),而IE7-瀏覽器返回5
    console.log(test.offsetTop);
</script>

【2】若父級設置position: aboslute(或其他觸發(fā)haslayout的條件),offsetTop值為offsetParent元素的paddingBottom值和當前元素的marginTop值的較大值

<div id="out" style="padding: 5px;position:absolute;">
    <div id="test" style="width:100px; height:100px; margin:10px;"></div>        
</div>
<script>
    //其他瀏覽器返回15(5+10),而IE7-瀏覽器返回10(10和5的較大值)
    console.log(test.offsetTop);
</script>

回答
編輯回答
不討囍

既然是bug,當然就沒有原因咯。應該是當年標準還沒統(tǒng)一的時候各個瀏覽器的實現(xiàn)問題吧。有些在現(xiàn)在看來是bug但當年并不一定是,只是后來沒有被標準采納。

2018年9月22日 15:28