javascript - 在 jQuery 中为每个循环的嵌套中定位 $(this)

Question

我试图弄清楚，在遍历一些列表项时，如何在嵌套的 foreach 循环中定位每个“$(this)”等价物。这是我的问题的一个例子：

$('li').each(function(){
        // I believe $(this) would target each li item...
    $(this).children("li").each(function(){
        // ... but how can I target each of these li items? Doesn't $(this) target the original loop?
    });
});

Answer 1

$('li').each(function(){
    var $this = $(this);
    $this.children("li").each(function(){
        $this; // parent li
        this; // child li
    });
});

Answer 2

不要使用this！使用函数参数！

$('li').each(function(i, li){
    $(li).children("li").each(function(ii, li2){
        $(li)...
        $(li2)...
    });
});

这更符合原生 JavaScript 迭代器。

...虽然一个<li>不能是另一个的直系孩子<li>

Answer 3

查看 jQuery 函数（或方法，如果你愿意的话）的基本“原型”：

$[jQobject].[func]([callback]);

回调是将在 jQ 对象的上下文中调用的函数。this显然，上下文是。简单地说，这意味着：

$('#foo').click(function(){});
   /\                 /\
   || Is the context  ||
   =====================

无论是否嵌套循环，这同样适用于您的情况：

$('ul').each(function()
{
    //this is ul
    var that = this;//you'll often see code like this
    $('li', this).each(function()
    {
        //this is li
        //that is parent ul
    });
});

Answer 4

但是我如何才能针对这些 li 项目中的每一个？$(this) 不是针对原始循环吗？

没有。

this来自您直接所在的功能。

Answer 5

不，this是指每个子<li>项。试试看。

大多数（如果不是全部）与 DOM 交互的 jQuery 回调设置this为您正在使用的 DOM 元素。

你也可以写：

$('li').children("li").each(function(){
    var $this = $(this);
});