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

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]一样选择列表中的每个元素：

＆＃13;

＆＃13;

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

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

＆＃13;

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

＆＃13;

<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>

＆＃13;

＆＃13;

＆＃13;