从Object.keys(数据)的getElementById

时间:2019-04-05 19:38:40

标签: javascript html

我有简单的Ajax代码,可以解析Json数据并在其中填充动态div。我想动态获取getElementById时遇到问题。

我的键数组成功返回= [“ blue”,“ red”,“ etc” ..] 而且我有蓝色数据,红色数据等数据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。

1 个答案:

答案 0 :(得分:1)

如您所说,如果返回的数据是数组,那么Object.keys不是您应使用的,因为它用于遍历Objects的属性(键)。如果只有数组,则直接在其上循环:

// 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>