学習めも。

Python、Anaconda学習中🔰 ブログ引っ越ししました😄よろしくお願いします!https://noeiganolife.com/

記録用🔰

プログラミング以外の記事はこちら

ボタンを押すとAPIのJsonの情報がそれぞれ追加されるようにする

ボタンを押すとAPIJsonの情報が追加されるようにする

▼asyncとawait fetchというのを使うと良い ・htmlにいれる

<button id = "addBtn">

<script src="index.js"></script>
const button = document.getElementById('addBtn');
const lists = document.getElementById('lists');

button.addEventListener("click", async function(){
  //データのやり取り
  const res = await fetch("https://jsonplaceholder.....");
  const users = await res.json();

  //DOM操作
  users.forEach(function(user){
    const list = document.createElement("li");
    list.innerText = user.name;
    lists.appendChild(list);
  })
})


//IDが5以下の人のみ表示させたいとき
user.forEach(function (user){
  if(user.id < 5){
    const .....
  }
})