getElementById from Object.keys(data)

Question

我有简单的Ajax代码，解析Json数据并在其中填充动态div。当我想动态getElementById时，我遇到了问题.

我的密钥数组成功返回 = ["蓝色"，"红色"，"等"..]我有蓝色数据、红色数据等数据div ID。

<div id="blue-data">myblue</div>
<div id="red-data">myred</div>
<div id="etc-data">myetc</div>

我的代码如下：

      success: function(data) {
      Object.keys(data).forEach(function(key,index) {

            console.log(document.getElementById(''+key+'-data').innerHTML);

         });
});

当我跑步时给：

console.log(document.getElementById(''+key+'-data'(.innerHTML(;

线

Error
null is not an object (evaluating 'document.getElementById(''+key+'-data').innerHTML')

但在控制台中，输出是;

myblue
myred
myetc

我该如何解决这个问题？我想在值中使用键数据div。

Answer 1

如果你返回的数据是一个数组，正如你所说，那么Object.keys不是你应该使用的，因为它是迭代对象的属性(键(。如果你只有一个数组，直接循环它：

// This is just simulating the result of your `success` handler's argument:
let data= ["blue","red","etc"];
// This would be INSIDE of your success callback function
data.forEach(function(item) {
  console.log(document.getElementById(item + '-data').textContent);
});

<div id="blue-data">myblue</div>
<div id="red-data">myred</div>
<div id="etc-data">myetc</div>