.each（）中的jQuery .find（）无法正常工作

Question

目前，我陷入了一个非常基本的jQuery问题。我认为对于jquery的.each（）我有些不了解。

这是我的代码：

     $('.test-list .test-item').each(() => {
        console.log($(this).find('.test-paragraph').text()); //not working always empty
     });

我只是遍历一堆效果很好的项目。但是然后我想在元素中获取the.test-paragraph的文本。问题是find（）方法不起作用。所有html元素都存在。

<div class="test-list">
   <div class="test-item">
      <p class="test-paragraph">Test 1</p>
   </div>
   <div class="test-item">
      <p class="test-paragraph">Test 2</p>
   </div>
   <div class="test-item">
      <p class="test-paragraph">Test 3</p>
   </div>
</div>

有谁知道这是什么问题？

Answer 1

根据MDN文档：

箭头函数表达式的语法比函数表达式短，并且不绑定自身的this，arguments，super或new.target。箭头函数始终是匿名的。这些函数表达式最适合于非方法函数，因此不能用作构造函数。

箭头内部功能this不会引用该元素，因此请使用常规功能。

$('.test-list .test-item').each(function() {
   console.log($(this).find('.test-paragraph').text());
});

或者，您可以将text()method与回调一起使用，以迭代并获取元素的文本内容。

$('.test-list .test-item .test-paragraph').text((i, text) => console.log(text))

或者，而不是this使用箭头函数中的第二个参数以及引用该元素的文档。

$('.test-list .test-item').each((i, ele) => console.log($(ele).find('.test-paragraph').text()));