getElementById из Object.keys(данные)

#javascript #html

#javascript #HTML

Вопрос:

У меня есть простые Ajax-коды, анализирующие данные Json и заполняющие динамические разделы внутри. И у меня есть проблема, когда я хочу получить динамически getElementById .

Мой массив ключей успешно возвращает = [«синий», «красный», «etc» ..] и у меня есть синие идентификаторы данных, красные идентификаторы данных и т.д.

 <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);


         });

});
  

Когда я бегу , дает:

консоль.журнал(document.getElementById(» ключ ‘-данные’).innerHTML);

Строка

 Error

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

Но в консоли вывод;

 myblue
myred
myetc
  

Как я могу это исправить? Я хочу получить с помощью key-data div внутренние значения.

Комментарии:

1. Object.keys предназначен для объектов, а не массивов.

2. К вашему сведению, '' бесполезно в этом контексте

3. @epascarello та же ошибка, которую я удалил.

4. На каком ключе происходит сбой? console.log (ключ), я предполагаю, что один из них не существует

5. @JuanCaicedo Нет. .forEach() аргументами являются key и index . data это то, что OP пытается выполнить в цикле, но это неправильный цикл.

Ответ №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>  

Комментарии:

1. чувак, твой пример работает, но в моих кодах написано: Не удается найти переменную: результат, и когда я изменил результат на ключ, выдает ; ключ. forEach не является функцией. (В ‘ключ. forEach(функция(ключ) { console.log(document.getElementById(ключ ‘-data’).textContent); })’, ‘ключ. forEach’ не определено)

2. @SwiftDeveloper Я назвал переменную result в моем примере. Конечно, вам нужно изменить имя, чтобы оно соответствовало вашему коду. В вашем коде вы бы использовали data.forEach() .

3. говорит, что data.forEach не является функцией. (В ‘data.forEach(функция(элемент) { console.log(document.getElementById(элемент ‘-data’).textContent); })’, ‘data.forEach’ не определено)

4. @SwiftDeveloper Тогда у вас на самом деле нет массива, который вы указали в своем вопросе. Добавьте console.log(data) в качестве первой строки в свой success обработчик и сообщите нам, что он сообщает.

5. Массив, о котором он говорит, — это Object.keys (data) ….. и если он зацикливается и выдает ошибку, то он работает нормально. Проблема в том, что одного из ключей нет в DOM, и он должен его отладить. Буквально мы ничего не можем сделать.