Javascript/GMA(2302~)

230613 자바스크립트 JSON 외부 링크 데이터를 가져와 출력하기

hyerin1201 2023. 6. 13. 13:02

 

HTML

<body>
  <main>
    <button>불러오기</button>
    <pre id="log">
      (데이터를 표시하는 영역)
    </pre>
  </main>
</body>

 

Javascript

const btn = document.querySelector("button")

btn.addEventListener("click", (e) => {
  async function load() { //외부에서 끌고와야하는 데이터의 경우, 다른데이터가 있다면 동기처리로 실행할시 오버로딩, 홀딩 문제가 발생할수 있기때문에
    const data = await fetch("https://jsonplaceholder.typicode.com/comments");
    const obj = await data.json();
    document.querySelector("#log").innerHTML = JSON.stringify(obj, null, " ");
  }
  load()
});