Question

使用当前的代码，我可以遍历单个对象来获取所需的数据。我试图遍历所有可用对象时遇到问题，以便可以从ajax搜索返回的所有对象中获取数据。

这是我用来搜索单个对象的代码。

$.ajax({
 url: "",
 type: "get",
 async: true,
 contentType: "application/json",
 success: function(data) {
 console.log(data);


   var fields = data[0].Fields ;


 document.getElementById("test").innerHTML = fields
 .map(function(field) {
  return '<p>' + field.DisplayName + ': ' + field.DataValue + '</p>';
  })
 .join('\n');

我尝试删除var字段= data [0] .fields中的[0]，但是我得到的地图未定义。

当我尝试添加for循环以搜索所有可用对象时，我很确定自己设置错误。我无法读取未定义的属性长度...

  var fields = data.Fields ;
  for(i = 0; i > fields.length; i++){
   document.getElementById("test").innerHTML = fields
 .map(function(field) {
  return '<p>' + field.DisplayName + ': ' + field.DataValue + '</p>';
 })
 .join('\n');
 }

这是console.log（data）输出

(3) [{…}, {…}, {…}]
0: {Fields: Array(8), DocImage: {…}}
1: {Fields: Array(8), DocImage: {…}}
2: {Fields: Array(8), DocImage: {…}}
length: 3
__proto__: Array(0)

Answer 1

根据您的回答，我猜您的数据如下：

var data = [{Fields: [{DisplayName: 1, DataValue: 1}, {DisplayName: 2, DataValue: 2}], DocImage: '1'},
            {Fields: [{DisplayName: 11, DataValue: 11}, {DisplayName: 22, DataValue: 22}], DocImage: '2'},
            {Fields: [{DisplayName: 31, DataValue: 31}, {DisplayName: 32, DataValue: 32}], DocImage: '3'}] ;

如果是这样，您的周期可以是：

document.getElementById("test").innerHTML = data.map(function(field) {
    return field.Fields.map(function(e) {
        return '<p>' + e.DisplayName + ': ' + e.DataValue + '</p>';
    }).join('<br/>');
}).join('<br/>');

var data = [{Fields: [{DisplayName: 1, DataValue: 1}, {DisplayName: 2, DataValue: 2}], DocImage: '1'},
{Fields: [{DisplayName: 11, DataValue: 11}, {DisplayName: 22, DataValue: 22}], DocImage: '2'},
{Fields: [{DisplayName: 31, DataValue: 31}, {DisplayName: 32, DataValue: 32}], DocImage: '3'}] ;

document.getElementById("test").innerHTML = data.map(function(field) {
    return field.Fields.map(function(e) {
        return '<p>' + e.DisplayName + ': ' + e.DataValue + '</p>';
    }).join('<br/>');
}).join('<br/>');

<div id="test"></div>

Answer 2

您应该遍历数据数组而不是Fields属性：

  for(i = 0; i > data.length; i++){
   document.getElementById("test").innerHTML = data[i].fields
 .map(function(field) {
  return '<p>' + field.DisplayName + ': ' + field.DataValue + '</p>';
 })
 .join('\n');
 }

Answer 3

根据API提供给您的数据结构，您可以在一个循环中循环；例如：

const data = [
  {Fields: [{DisplayName: 'a', DataValue: 1}]},
  {Fields: [{DisplayName: 'b', DataValue: 2}, {DisplayName: 'c', DataValue: 3}]},
];

document.getElementById("test").innerHTML = data.map(({Fields}) => (
  Fields.map(({DisplayName, DataValue}) => (
    `<p>${DisplayName}: ${DataValue}</p>`
  )).join('\n')
)).join('\n');

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>title</title>
  </head>
  <body>
    <p id=test></p>
  </body>
</html>

如何遍历api数组中的多个对象

3 个答案: