jquery 每个从数组中逐渐填充元素

Question

你好，我想用数组的值逐渐填充 span 元素。你能帮帮我吗？

<span class="gt"></span>
<span class="gt"></span>
<span class="gt"></span>

var array=["apple","banana","cucumber"];

$("span.gt").each(function(){
    $(this).text(array[?]);
});

输出应如下所示：

<span class="gt">apple</span>
<span class="gt">banana</span>
<span class="gt">cucumber</span>

Answer 1

您在 each 循环的函数中得到 index 值。由于 span 元素的数量等于 array 变量中的项目数，您可以使用该 index 值来设置 span 元素中的数组值：

var array=["apple","banana","cucumber"];

$("span.gt").each(function(index){
    $(this).text(array[index]);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="gt"></span>
<span class="gt"></span>
<span class="gt"></span>

Answer 2

你可以使用for循环。
使用增量数作为跨度索引和数组索引

var array = ["apple", "banana", "cucumber"];
for (var i = 0; i < array.length; i++) {
  $('span').eq(i).text(array[i]);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="gt"></span>
<span class="gt"></span>
<span class="gt"></span>

jquery 每个从数组中逐渐填充元素

jquery each fill elements gradually from array

javascript

arrays

each

jquery

elements