给人一种独特的文字，每一个元素

Question

所以...我有一个网页四个div秒。他们四人都属于classfoobar。我想在这里做的是在JavaScript一定Array给他们的每一个值。注意我正在使用jQuery 3.2.1。

我的javascript：

var $elements = jQuery.makeArray($(".foobar")); 
[1,2,3,4].forEach(function (x) { 
    $elements.forEach(function (y) { 
    y.text(x.toString()); 
    }); 
}); 

我的HTML：

<div class="foobar"></div> 
<div class="foobar"></div> 
<div class="foobar"></div> 
<div class="foobar"></div> 

和往常一样，这是行不通的。基本上，我想在这里做的就是给在Array每个Number为text()每个div。

Answer 1

检查这个小提琴。 https://jsfiddle.net/bj3s92gr/
Bassicaly你必须bucle带班foobar的的div，并assing在html阵列的位置。

var $elements = $(".foobar"); 
$arr = [1,2,3,4]; 
$elements.each(function(e){ 
    $(this).html($arr[e]); 
}); 

Answer 2

要设置相同的文本到内环内的每个元素。试试这个

var $elements = $(".foobar"); 
[1,2,3,4].forEach(function (x, i) { 
    $($elements[i]).text(x) 
}); 

或者使用.text(func)

var texts = [1,2,3,4]; 
var $elements = $(".foobar").text(function(i) { 
    return texts[i]; 
}) 

Answer 3

创建数字数组，遍历直通所有.foobar元素，并分配数组中的一个值。

var $elements = jQuery.makeArray($(".foobar")); 
 
var numbers = [1, 2, 3, 4]; 
 
var count = 0; 
 
$(".foobar").each(function() { 
 
    $(this).text(numbers[count]); 
 
    count++; 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
My HTML: 
 

 
<div class="foobar"></div> 
 
<div class="foobar"></div> 
 
<div class="foobar"></div> 
 
<div class="foobar"></div>