这两者之间的主要区别是什么?似乎有时浏览器接受jQuery的element.offset()而不是典型的element.offsetLeft
这个代码的非常好的例子是
(function () {
var mX, mY, distance,
$distance = $('#distance span'),
$element = $('#element');
function calculateDistance(elem, mouseX, mouseY) {
return Math.floor(Math.sqrt(Math.pow(mouseX - (elem.offset().left + (elem.width() / 2)), 2) + Math.pow(mouseY - (elem.offset().top + (elem.height() / 2)), 2)));
}
$(document).mousemove(function (e) {
mX = e.pageX;
mY = e.pageY;
alert(mX);
alert((mX - ($element.offsetLeft + ($element.width() / 2))));
distance = calculateDistance($element, mX, mY);
$distance.text(distance);
});
})();
如果你将elem.offset()。left替换为elem.offsetLeft或$ element.offsetLeft,则返回NaN,如果你只是提醒offset(),则返回。左//返回182.5或alert offsetLeft //返回183什么是魔法背后呢?
来自css-tricks http://jsfiddle.net/chriscoyier/t5Kts/ 的演示
答案 0 :(得分:1)
jQuery offset()给出了元素相对于文档根的位置。 element.offsetLeft给出相对于其父元素的左侧位置。
要将element.offsetLeft与jQuery一起使用,您需要访问实际的DOM元素,而不是元素的jQuery对象表示:
$element[0].offsetLeft