如何获取类名每个元素的偏移位置？

Question

如何使用classname获取每个元素的顶部偏移位置？

我需要为每个名为的类返回一个值 .Me

（这次不能用jQuery）

这就是我尝试这样做的方式：

var list = document.querySelectorAll('.Me');

for (var i = 0; i < list.length; i++) {
    var me = document.getElementsByClassName('Me');
    console.log(me.offsetTop);
}

div,p { position: relative; }
div{ background:#ddd;}
.Me{ background:#7ae;}

<p>Content before container</p>
<div>
    <p>Space</p>
    <p>content</p>
    <p>padding</p>
    <p class="Me">Me 1</p>
    <p class="Me">Me 2</p>
    <p class="Me">Me 3</p>
</div>

Answer 1

您需要通过这样做来选择列表中的每个元素list[index]：

var list = document.getElementsByClassName('Me');

for (var i = 0; i < list.length; i++) {
    var me = list[i];
    console.log(me.offsetTop);
}

div,p { position: relative; }
div{ background:#ddd;}
.Me{ background:#7ae;}

<p>Content before container</p>
<div>
    <p>Space</p>
    <p>content</p>
    <p>padding</p>
    <p class="Me">Me 1</p>
    <p class="Me">Me 2</p>
    <p class="Me">Me 3</p>
</div>