Печать Ajax приводит к HTML

Question

У меня есть этот J-код запроса: $ (документ) .ready (function () {

                     var $outData = $('#data');
                     var ajaxUrl = 'url.json';
                     $.ajax(
                         {
                             type: 'GET',
                             url:ajaxUrl,
                             success: function (result) {
                                 console.log(result.passwords);   
                                 }
                             })
                         }
                     );

JSON файл выглядит так:
{"пароли": [
{"value": "tom", "count": "432517"},
{"value": "anaconda", "count": "454658"},
{"value": "111111" , "count": "148079"},

Что мне нужно сделать, это распечатать каждый из этих объектов для распечатки в упорядоченном списке (например, это должно выглядеть так:

1. Том 432517
2. Анаконда 454658
3. 111111 148079

Пока ничего, что я пробовал, не могу, но я могу утешить .log Весь объект. Есть предложения?

Answer 1

Пример рендеринга:

var $outData = $('#data');
                     var ajaxUrl = 'url.json';
                     $.ajax(
                         {
                             type: 'GET',
                             url:ajaxUrl,
                             success: function (result) {
                                 result.passwords.forEach(pwd => $outData.append(`<div>${pwd.value} ${pwd.count}</div>`));   
                                 }
                             })
                         }
                     );

Answer 2

вы можете создавать элементы и добавлять в DOM, когда вы закончите,

const data = {
  "passwords": [{
      "value": "tom",
      "count": "432517"
    },
    {
      "value": "anaconda",
      "count": "454658"
    },
    {
      "value": "111111",
      "count": "148079"
    }
  ]
}
const ol = document.createElement("ol");
for (const {
    value,
    count
  } of data.passwords) {
  const li = document.createElement("li")
  li.innerText = `${value} -> ${count}`
  ol.appendChild(li)
}
document.querySelector("#root").appendChild(ol)

<div id="root"></div>