Question

在下面的代码中，使用jquery＆each;每个（）和html（）只插入第一个div值，即＃34; David Smith＆＃34;在整个数组（all_names []）中，我希望each（）迭代每个div并将它们对应的值插入到相应的数组索引中。

除了代码更正之外，我更愿意，如果有人能告诉我每个（）或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>

Answer 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
});

Answer 2

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

<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>

Answer 3

使用.map()代替.each()

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

最后需要

.get()来转换.map()返回普通数组的jQuery集合。

jquery html（）只给出each（）方法使用的第一个值

3 个答案: