Erstellen Sie Divs, um jeden Teil des externen JSON zu speichern

Question

Also habe ich die Grundlagen zusammengestellt, um aus einem extern gehosteten JSON zu zeichnen und es wie folgt anzuzeigen:

Das Format von JSON ist wie folgt:

{
    "title": "Nationale Kugeln",
    „Quelle“: „Dataloft“,
    "Daten": {
        "Wirtschaft": [
            „Die britische Wirtschaft blieb im Februar stabil, da die Auswirkungen des Streiks einen Anstieg der Bautätigkeit ausgleichen konnten. Laut ONS-Bericht wuchs die Wirtschaft in den drei Monaten bis Februar um 0,1 %.“
            „Im März lag die Inflation bei 10,1 %, was einem Rückgang von 0,3 % gegenüber Februar entspricht. Die Lebensmittelpreise steigen weiter, während die Kraftstoffpreise gesunken sind. Es wird erwartet, dass die Inflation im Jahr 2023 sinken wird.“,
            „Die Bank of England hat den Leitzins auf 4,25 % angehoben, den höchsten Stand seit 14 Jahren, und es wird erwartet, dass die Zinssätze in diesem Jahr mit 4,5 % ihren Höchststand erreichen. Die nächste MPC-Sitzung findet am 11. Mai statt.“
        ],
        „Transaktionen“: [
            „Laut Daten von Rightmove war die Zahl der im März 2023 geschlossenen Kaufverträge nur 1 % geringer als im März 2019. Dies ist das erste Mal seit September 2022, dass die Zahl der Kaufverträge wieder das Niveau vor der Pandemie erreicht hat.“
            „In den nächsten 12 Monaten erwarten Agenten mit einem Nettosaldo ein Umsatzwachstum, was das erste Mal seit März 2022 ist, dass der RICS-Indikator positiv geworden ist. Agenten gehen davon aus, dass die Verkäufe in den nächsten drei Monaten unter Druck bleiben werden.“,
            „Laut HMRC-Bericht fanden im Februar 2023 90.340 Transaktionen statt, 18 % weniger als 2022 und 7 % weniger als auf dem sogenannten ‚normalen‘ Markt im Jahr 2019.“
        ],
        "Hauspreise": [
            „Nach den neuesten offiziellen Prognosen des Amtes für Haushaltsverantwortung werden die Preise auf dem Wohnungsmarkt im Jahr 2023/24 voraussichtlich um 6,8 % sinken, verglichen mit einem Preiswachstum von mehr als 19 % im Jahr 2021–22.“
            „Der geforderte Preis für den Verkauf mit einem Rabatt von 4,5 % ist der höchste seit 5 Jahren (Zoopla) und viele potenzielle Verkäufer auf dem aktuellen Markt sind bei der Preisgestaltung zu optimistisch.“,
            „Der durchschnittliche Hauspreis lag im Januar 2021 bei 288.074 £, 1,1 % weniger als im Vormonat, aber 6,3 % höher als im gleichen Zeitraum des Vorjahres (UK HPI, ONS).“
        ],
        "Nachfrage": [
            „Die Nachfrage nach Immobilien ist seit Dezember deutlich gestiegen. Laut Propertymark-Daten registrierte jeder Makler im Februar 2022 94 potenzielle Käufer, verglichen mit 70 im Januar und 39 im Dezember.“
            „Die Zahl der Hypothekendarlehensgenehmigungen lag im Februar 2022 bei 43.536, 34 % unter dem Durchschnitt vor der Pandemie (2015–2019), aber 10 % höher als im Januar. Die Genehmigungen im Februar vor der Pandemie waren in der Regel etwas niedriger als im Januar.“,
            „Laut der neuesten RICS Residential Market Survey gaben 40 % der Befragten an, dass sie ein erhöhtes Interesse an energieeffizienteren Häusern sehen, und 61 % gaben an, dass der Wert energieeffizienter Häuser unter den aktuellen Marktbedingungen stabil bleibe."
        ],
        "Entwicklung": [
            „Regierungspläne sehen vor, dass alle verkauften Häuser bis 2033 über einen Energieausweis der Klasse C verfügen müssen und ab 2025 keine neuen Häuser mehr mit Gaskesseln gebaut werden dürfen. Die Vorschläge sind Teil des Zero Emissions Lookback-Programms der britischen Regierung.“
            „Während die Bautätigkeit insgesamt im März zunahm, ging die Aktivität im Wohnungssektor zurück, wobei die Befragten aufgrund steigender Kosten weniger Ausschreibungsmöglichkeiten anführten (IHS Markit).“,
            „Laut den vom DLUHC veröffentlichten Daten wurden im Jahr 2022 mehr als 260.000 neue Wohnungen gebaut, ein Anstieg von 3,3 % gegenüber 2022. Mehr als 68.000 neue Wohnungen wurden im letzten Quartal fertiggestellt, ein Anstieg von 8,9 % im Vergleich zum Vorjahr. "
        ],
        „Investition/Vermietung“: [
            „Die Nachfrage nach Mietobjekten ist laut der neuesten RICS-Umfrage auf dem höchsten Stand seit fünf Monaten. Die Nachfrage übersteigt weiterhin das Angebot und die Mietwerte bleiben unter Druck.“,
            „Die privaten Mietpreise im Vereinigten Königreich stiegen im Jahr bis März um 4,9 %, wobei viele Gebiete in England und Wales ihr stärkstes Wachstum seit Beginn der Aufzeichnungen verzeichneten. Der ONS-Index für private Wohnungsmietpreise umfasst bestehende und neue Mietobjekte.“
            „Die Regierung berät über Pläne, Hausbesitzer dazu zu verpflichten, eine Baugenehmigung einzuholen, bevor sie ihre Immobilien in kurzfristige Ferienvermietungen umwandeln, was für Touristenorte gelten würde. Es könnten Vermietungszeiträume von 30 bis 90 Tagen zugelassen werden, bevor eine Genehmigung erforderlich ist.“
        ],
        „Prime Markets“: [
            „Laut Untersuchungen der Brookings Institution hat die Einführung des Overseas Entity Register im Vergleich zu anderen ausländischen Gerichtsbarkeiten zu einem erheblichen Rückgang der Immobilientransaktionen mit Offshore-Steueroasen im Vereinigten Königreich geführt.“
            „Das Angebot auf dem Londoner High-End-Mietmarkt ist stark zurückgegangen. Laut Knight Frank waren die Mietaufträge in der zweiten Monatshälfte um 21 % niedriger als in den ersten anderthalb Monaten, gefolgt von einem Rückgang um 12 % in den folgenden zwei Wochen .",
            „Der PCL-Verkaufsrekord im ersten Quartal dieses Jahres war 21 % niedriger als im ersten Quartal 2022 und 22 % niedriger als im Vorquartal. Der Verkaufsrekord im ersten Quartal 2023 war jedoch niedriger als in jedem ersten Quartal von.“ 2017 bis 2020 Mehr (JLL)."
        ]
    }
}

Das Skript, mit dem ich die JSON-Daten zeichne und in HTML einfüge, lautet wie folgt:

<code>let dataloft_national_bullets_url = FRJIgxkZWZhdWx0BjsAVEkiD2V4cGlyZXNfYXQGOwBUMA==--36ebf74c32194c59ad4a7d9fb89db230a66efadf/V8UDrS9mIAVkNJcgBI3e3Q/national_bullets";
fetch(dataloft_national_bullets_url)
    .then((response) => Response.json())
    .then((Nutzlast) => {
        let container = document.getElementById("national_bullets_target_container");
        for (const div in payload.data) {
            let data = document.createElement('div');
            data.appendChild(document.createTextNode(div));
            container.appendChild(data);
            for (const-Kapitel in payload.data) {
                let header = document.createElement('h1');
                header.appendChild(document.createTextNode(kapitel));
                container.appendChild(header);
                for (const-Absatz in payload.data[Kapitel]) {
                    let para = document.createElement('li');
                    para.appendChild(document.createTextNode(payload.data[chapter][paragraph]));
                    container.appendChild(para);
                }</code>

Answer 1

尝试删除额外的循环：for (const div in payload.data)？

let dataloft_national_bullets_url =
  'https://inform.dataloft.co.uk/api/BAh7CEkiCGdpZAY6BkVUSSIrZ2lkOi8vaW5mb3JtL1VzZXJBcmVhLzI2NzM2P2V4cGlyZXNfaW4GOwBUSSIMcHVycG9zZQY7AFRJIgxkZWZhdWx0BjsAVEkiD2V4cGlyZXNfYXQGOwBUMA==--36ebf74c32194c59ad4a7d9fb89db230a66efadf/V8UDrS9mIAVkNJcgBI3e3Q/national_bullets';

fetch(dataloft_national_bullets_url)
  .then((response) => response.json())
  .then((payload) => {
    let container = document.getElementById(
      'national_bullets_target_container'
    );

    for (const chapter in payload.data) {
      const data = document.createElement('div');
      data.appendChild(document.createTextNode(chapter));

      let header = document.createElement('h1');
      header.appendChild(document.createTextNode(chapter));
      data.appendChild(header);

      for (const paragraph in payload.data[chapter]) {
        let para = document.createElement('li');
        para.appendChild(
          document.createTextNode(payload.data[chapter][paragraph])
        );
        data.appendChild(para);
      }

      container.appendChild(data);
    }
  });

<div id="national_bullets_target_container"></div>