Question

我试图遍历whateverDiv并找到每个元素的偏移量。我收到错误消息Uncaught TypeError: undefined is not a function，我怀疑因为无法在元素上调用.offset()。这让我想到如何在数组中的元素上调用函数，例如.offset()和.is(":hover")。

whateverDiv  = document.getElementsByClassName('whatever')
//RETURNS SOMETHING LIKE [<img src="http://www.whateversource.jpg">,<img src="http://www.whateversource2.jpg">]
for (i in whateverDiv){
    console.log(whateverDiv[i].offset())
}

Answer 1

假设你有jquery包含

whateverDiv  = document.getElementsByClassName('whatever')
//RETURNS SOMETHING LIKE [<img src="http://www.whateversource.jpg">,<img src="http://www.whateversource2.jpg">]
for (i in whateverDiv){
    var $div = $(whateverDiv[i])
    console.log($div.offset())
}

正如其他人所提到的，你不应该使用for in，而应该使用标准的for构造。但是，如果你已经使用了jQuery，你也可以喝koolaide并使用他们的.each

http://api.jquery.com/each/

$(".whatever").each(function() {
  console.log( $(this).offset() );
});

Answer 2

您已使用两种for循环的组合编码循环。

for (i in whateverDiv) {
    // 'i' is each element
}

VS

for (var i = 0; i < whateverDiv.length; i++) {
    // 'i' can be used as an index of the 'whateverDiv' collection
}

然而，正如评论中所述，最好的办法是使用所有jQuery，因为循环中的对象仍然需要转换为jQuery对象才能使用这些函数。

$('.whateverDiv').each(function () {
    console.log($(this).offset());
});

Answer 3

你可以使用jQuery循环：

 $('.whatever').each(function(index, value) {
    console.log('Item: ' + index + ' - element: ' + $(value).text());
   // you could call a function like this on each element:
   // yourFunction($(value));
   // or a function of the jQuery element -> $(value).offset();    
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="whatever">
  item one
</div>
<div class="whatever">
  item two
</div>
<div class="whatever">
  item three
</div>
<div class="whatever">
  item four
</div>
<div class="whatever">
  item five
</div>

将FOR循环用于由类选择的元素数组，并在每个元素上调用函数

3 个答案: