在JavaScript中，console.log给出了for循环的每个值.但是var.text只显示最后一个值.这是为什

In JavaScript console.log gives me every value from a for loop. However var.text only displays the last value. Why is this?

本文关键字：text 但是 显示 var 最后一个 console log JavaScript 循环 for      更新时间：2023-09-26

所以我使用Music Graph API来访问和显示与当前艺术家相似的艺术家(在本例中为" the Who.")。然而，当我使用for循环来遍历结果时，.text(artistNames)只打印数组中的姓氏(在这种情况下，它只打印Pink Floyd，即使数组包含更多的艺术家)。但是，console.log打印数组中的每个名称。我如何得到。text打印数组中的每个名字?

下面是我的代码:

JavaScript

for (i = 0; i < response.data.length; i++) {
    var artistNames = response.data[i].name;
    $('#relatedArtists').text(artistNames);
    console.log(artistNames);
}


<div id="relatedArtists">
</div>

您需要使用 append() ， text() 将清除之前的数据

for (i = 0; i < response.data.length; i++) {    
    var artistNames = response.data[i].name;    
    $('#relatedArtists').append(artistNames);    
    console.log(artistNames);    
}

或者您可以使用 text() 与回调

附加先前的数据。
for (i = 0; i < response.data.length; i++) {    
    var artistNames = response.data[i].name;    
    $('#relatedArtists').text(function(i,text){ return text + artistNames; });    
    console.log(artistNames);    
}

因为在每次迭代中您都重写div的先前值。

相反，您可以创建一个包含所有名称的数组，然后通过连接

等值将其设置为div的文本。

var response = {
  data: [{
    name: 'n1'
  }, {
    name: 'n2'
  }, {
    name: 'n3'
  }]
}
$('#relatedArtists').text(response.data.map(function(item) {
  return item.name
}).join());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="relatedArtists">
</div>

相关文章：