jquery html() 只给出每个 () 方法使用的第一个值答案

【问题标题】：jquery html() give out only first value used with each () methodjquery html() 只给出每个 () 方法使用的第一个值
【发布时间】：2016-03-10 07:26:58
【问题描述】：

在下面的代码中，使用 jquery 的 each() 和 html() 仅在整个数组 (all_names[]) 中插入第一个 div 值，即“David Smith”，我希望 each() 遍历每个 div 并插入将它们对应的值放入对应的数组索引中。

除了代码更正之外，我更希望有人能告诉我 each() 或 html() 函数的这种行为背后的原因（我不确定）。我是 jQuery 的初学者，这将帮助我加深对 jquery 的理解。

谢谢 dkj

HTML

<div class="test"><a href="#">David Smith</a></div>
<div class="test"><a href="#">Adam John </a></div>
<div class="test"><a href="#">Tina Samara </a></div>
<div class="test"><a href="#">James White </a></div>

JQUERY

<script type="text/javascript">
    var all_names = [];
    var total_names = $('div.test a');

    total_names.each(
        function() {
             all_names[counter] = total_names.html();
             counter++;
        }
    );      

 alert("total Names: " + all_names);

 </script>

【问题讨论】：

total_names.eq(counter).html() 但是all_names 是一个数组，所以警告它不会给你任何预期的结果。您的代码中似乎有很多错误...

标签： javascript jquery each

【解决方案1】：

您错过了each 的要点。它遍历数组，将数组中的当前元素作为第二个参数（第一个是当前索引）提供给其回调函数。您总是在整个匹配列表上调用它，而不是在循环中的当前元素上调用 html。

<script type="text/javascript">
    var all_names = [];
    var total_names = $('div.test a');

    total_names.each(
        function(idx, elemInArray) {
             all_names[counter] = $(elemInArray).html();
             counter++;
        }
    );      

 alert("total Names: " + all_names);

 </script>

另外值得注意的是，在每个迭代中，this 是对当前项目的引用。它可以简化访问这样的项目

$(someArrayOfElements).each(function() {
    console.log($(this).html()); // $(this) is the current item wrapped into a jQuery object
});

【讨论】：

你犯的错误与其他发布的答案一样，我错了吗？！
必须是$(elemInArray).html() 或$(this).html()。

【解决方案2】：

使用.map() 而不是.each()

var all_names = total_names.map(function() {
    return $(this).html();
}).get();

最后需要.get()，将.map()返回的jQuery集合转换为普通数组。

【讨论】：

【解决方案3】：

使用每个函数的第二个参数来实现项目

<script type="text/javascript">
   var all_names = [];
   var total_names = $('div.test a');

   total_names.each(
       function(index, item) {
            all_names[counter] = $(item).html();
            counter++;
       }
   );      

 alert("total Names: " + all_names);

 </script>

【讨论】：

item 是这里的索引，需要例如：each(function(_, item){...})
item 不是一个 jQuery 对象，它是一个 DOM 元素。您需要使用$(item).html()。
是的，Barmar 是对的。仅适用于 $(item).html()。