jquery的offset.top用原生js怎样写
2个回答
展开全部
你好，原生的写法是这样的
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
*,body{padding:0; margin:0}
.div{position:absolute; left:0px; top:50px; width:50px; height:50px; background-color:#006}
</style>
</head>
<body>
<div class="div" id="obj"></div>
<script type="text/javascript">
var obj = document.getElementById("obj");
alert(obj.offsetTop)
</script>
</body>
</html>
希望可以帮助到你
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
首先，jQuery的offset().top指的是元素到窗口顶部的距离，而原生js的offsetTop指的是元素到父元素的距离，所以我们可以采用递归的方法得到这个值。
function getOffset(node, offset) {
// 创建一个对象存储offset
if (!offset) {
offset = {};
offset.top = 0;
offset.left = 0;
}
// 当该节点为body节点时，结束递归
if (node == document.body) {
return offset;
}
offset.top += node.offsetTop;
offset.left += node.offsetLeft;
// 向父元素累加offset里的值
// 一开始我是这样写的return getOffset(node.parentNode, offset);
// 后面我发现对于一些position定位的元素，offsetTop指的是它与offsetParent的距离
// 所以node.parentNode应改为node.offsetParent
return getOffset(node.offsetParent, offset);
}
var div = document.getElementById('div');
getOffset(div).top;getOffset(div).top的值就等于jQuery的div.offset().top
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
