Question

所以我有以下代码必须返回给定对象的屏幕坐标：

<!DOCTYPE HTML>
<html>
<head>
</head>
<body style="margin:0px;padding:0px;">

<div id="help" style="top:100px;right:100px;height:200px;width:200px;position:fixed;border:1px solid #000"></div>
<div id="what">what</div>
<div style="position:relative;margin-top:10000px;"></div>
<script>

function getoffset(element) {
    var xPosition = 0;
    var yPosition = 0;

    while(element) {
        yPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft);
        xPosition += (element.offsetTop - element.scrollTop + element.clientTop);
        element = element.offsetParent;
    }
    return [xPosition, yPosition];
}

function cl(){
    var help = document.getElementById('help');
    var what = document.getElementById('what');
    var where = getoffset(what);
    help.innerHTML= where;

}
setInterval(function (){cl()},100);
</script>
</body>

它在IE，chrome，opera和ff上工作正常，直到我添加<!DOCTYPE HTML>指令（强制IE尊重div定位）。
当我这样做时，这段代码会一直返回相同的值（只有Chrome正常）。我做错了什么？

Answer 1

您正在使用某些HTML或javascript，这取决于quirks mode中的浏览器是否正常运行（IE9 +还具有“IE8标准模式”）。添加有效的现代doctype使浏览器处于标准/严格模式。

问题可能是您使用scrollLeft / scrollRight和scrollTop / clientTop。他们behave differently in older browsers。

！doctype html破坏了我的脚本

1 个答案: