Question

我尝试使用jquery $(this)选择器和元素的类来计算div中的子节点数。结果不同。我认为jquery的$(this)引用了函数的所有者对象，我错过了$(this)有什么特别之处吗？

$('.parent').ready(function(){
        $('.parent').children().length; // 6
        $(this).children().length; // 1
});

Answer 1

此：

    $('.parent').children().length; // 6

是正确的方法。这样：

    $(this).children().each(function().length; // 1

是语法错误。如果你真的想要遍历孩子，你可以使用“.each（）”，但你必须正确地做到这一点：

    $(this).children().each(function() {
      var $child = $(this);
      // ...
    });

请注意，在“.each（）”回调中，this会连续引用每个子节点，因为jQuery会调用该函数。

Answer 2

$(this)方法中的

$('.parent').ready()引用$('.parent')对象。

$(this)集合的each()方法中的

children()引用当前迭代的子项。

因此，实现相同数字（无论出于何种原因）的方式是：

$('.parent').ready(function(){
   var directLength = $(this).children().length; // 6
   var indirectLength = 0;
   $(this).children().each(function(){
      indirectLength++;
   });

   alert([directLength, indirectLength].join("\n"));
});

编辑：你的评论只有一个含义：你有6个元素，类parent，每个元素只有一个孩子。所以我假设你想要计算父元素，这里是适当的代码：

$(document).ready(function() {
   var directLength = $('.parent').length; // 6
   var indirectLength = 0;
   $('.parent').each(function() {
      indirectLength++;
   });

   alert([directLength, indirectLength].join("\n"));
});

jQuery - 用$（this）选择子项

2 个答案: