javascript - jQuery 每次迭代中未定义的元素

Question

我正尝试按如下方式迭代一组 jQuery 元素:

var l = $(".ace_line").length;
$(".ace_line").each($(function(index,element) {
    console.log("Element = " + element);
    console.log(index + ": " + element.text());
}));

当我检查 l 时，它的值为 39，所以我知道该集合不为空。 但是，当我循环遍历集合时，element 是未定义的。

我做错了什么？

任何帮助将不胜感激!

Answer 1

这里有几个问题:

1. 您将回调包装在 $() 中，这让 jQuery 认为您使用的是 $(document).ready(function... )。由于 DOM 已准备就绪，它调用该函数(一次)将 jQuery 实例作为第一个参数传递给它，根本没有第二个参数。

2. 您没有在元素 周围使用$()。 element 只是一个 DOM 元素，而不是一个 jQuery 实例，因此要对其调用 text，您需要先包装它。

所以:

var l = $(".ace_line").length;
$(".ace_line").each(function(index,element) {
// No $( here ------^
    var $el = $(element);                     // <=== Do wrap `element`
    console.log("Element = " + $el);
    console.log(index + ": " + $el.text());   // <=== Use $el
}); // <== Removed a ) here

请注意，更正常的做法是使用this:

var l = $(".ace_line").length;
$(".ace_line").each(function(index) {
    var $el = $(this);                        // <===
    console.log("Element = " + $el);
    console.log(index + ": " + $el.text());   // <===
});