.each() 和 $(this)答案

【问题标题】：.each() and $(this).each() 和 $(this)
【发布时间】：2011-09-02 00:59:18
【问题描述】：

这是我的代码：

$myDiv = $('<div>1</div>');

$myDiv.each(function () {
    console.log(this.html());
});

它会产生错误，因为 this 应该是 $(this)。可是等等。 $myDiv首先不是一个jQuery对象，所以this也必须是一个jQuery对象。如果是这样，我为什么要将this 包裹在$( ) 内？

【问题讨论】：

标签： jquery

【解决方案1】：

jQuery 对象或多或少是一个常规 DOM 元素的数组。 each 遍历这些。 this 只是一个 DOM 元素，而 $(this) 生成一个单元素的 DOM 元素数组，可以访问 jQuery API 函数。

【讨论】：

请注意：所有 JQuery 方法都会自动应用于该数组中的每个元素。如果您不需要根据上述情况逐个处理单个元素，则没有理由使用 .each。 $('li').hide();隐藏所有 LI。 $('li').myNewMethod 也将应用于所有 LI，即使您仅将其定义为命中 'this'（扩展时指的是 JQ 对象）。
糟糕。纳米。完全错误的一部分。内置方法通常会为您循环。内部没有任何自动循环（我想知道他们是如何做到的）。

【解决方案2】：

在那种情况下this实际上是指节点。

$myDiv = $('<div>1</div>');

$myDiv.each(function () {
    console.log(this.innerHTML);
});
// outputs 1

【讨论】：

【解决方案3】：

基本上以$() 获取的任何内容都会成为jQuery 将其辅助方法添加到的数组的一部分，.each() 方法实际上会遍历数组中的每个元素。也就是说，它只是元素而不是 jQuery 数组，它拥有所有不错的辅助方法。

【讨论】：

【解决方案4】：

据我了解，this 是一个 DOM 对象。试试这段代码看看：

$myDiv = $('<div>1</div>'); $myDiv.each(function () { alert(this.nodeName); });

【讨论】：

【解决方案5】：

根据 jquery 文档，这是$(selector).each() 的预期行为他们甚至为您提供了“您想要使用 jQuery 对象而不是常规 DOM 元素”的示例：http://api.jquery.com/each/#example-1

【讨论】：

【解决方案6】：

当您像以前一样在 jQuery 中创建 HTML 对象时，它会返回 DOM 元素。如果你真的想设置新 dom 元素的 HTML，你必须像这样调用 innerHTML 属性：

$myDiv.each(function () {
    console.log(this.innerHTML);
});

这里是创建 DOM 元素的 jQUery API 供参考：http://api.jquery.com/jQuery/#jQuery2

另外，我不确定您为什么要在刚刚创建的单个元素上调用 each 函数？

【讨论】：