← Teacher guide Markdown for Prepare

Final challenge: a quiz page: cheat sheet

The DOM and the browser console · In any playground, open Reference to copy these.

fetch JSON

Asks for a file or web address, waits for the reply, then turns it into data (objects and arrays). Both lines need await, inside an async function.

const response = await fetch("weather.json");
const data = await response.json();
Example
<p id="out">Loading…</p>
<script>
  async function load() {
    const response = await fetch("weather.json");
    const data = await response.json();
    document.querySelector("#out").textContent = "Days: " + data.daily.time.length;
  }
  load();
</script>
What it draws
Loading… becomes Days: 7 once the file has arrived

async function

A function that may wait for slow things with await. Call it like any function; the rest of the page keeps going while it waits.

async function load() {
  … await …
}
load();