|
復制代碼 代碼如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>管理系統</title>
</head>
<body style="" onselectstart="return false;" ><!--7699c7-->
<div id="w3124" style="border:1px solid #ff0000;position:relative;top:200px;left:400px;width:400px;">
</div>
<SCRIPT>
alert(document.getElementById("w3124").getBoundingClientRect().top);
</SCRIPT>
</body>
</html>
下面是alert結果
IE、FF、Chrome:208
IE內核的Maxthon:215
IE內核的TheWorld:217
當body加上margin:0;padding:0 的時候IE、FF、Chrome、Maxthon下均為200,而只有TheWorld為202
然后把HTML代碼頭部的DOCTYPE聲明去掉的時候FF、Chrome、Maxthon值均為200,而IE由于進入Quirks模式,此時的值為202,而TheWorld仍為為202
結論
FF、Chrome、Maxthon為始終堅持標準模式(Standards Mode),IE在加了聲明后也進入標準模式(Standards Mode),只有TheWorld始終堅持Quirks模式,萬惡!
建議
為了兼容把body加上margin:0;padding:0,注意加DOCTYPE聲明(有了它IE還是挺聽話的)
另:
1.通篇用綠色希望大家眼睛能放松些。
2.小弟第一次發博客,心靈脆弱,無法承受各種打擊,如果有啥不對的,請指正,我一定虛心改正,拍磚請輕一點,謝謝啦
3.參考文獻
JavaScript技術:各種常用瀏覽器getBoundingClientRect的解析,轉載需保留來源!
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。