如何用JavaScript为Fetch API获取的JSON每条数据创建独立DIV？

完全可以实现，你只需要调整生成的HTML结构，把每条数据的标题和内容包裹在一个独立的<div>里就行。修改后的代码如下：

const promise = fetch('https://jsonplaceholder.typicode.com/posts');
promise.then((response) => {  
  return response.json();
})
.then(data => {
  data.forEach(post => {
    const markup = `
      <div class="post-item">
        <p>${post.title}</p>
        <p>${post.body}</p>
      </div>
    `;
    document.querySelector('.square').insertAdjacentHTML('beforeend', markup)
  });
})
.catch(error => console.log(error));

修改说明： #

• 把原来的两个<p>标签嵌套在一个<div class="post-item">容器内，每条JSON数据对应一个独立DIV
• 给DIV添加类名post-item，方便后续通过CSS样式调整布局或美化
• 将变量名sentence改为更贴合语义的post，提升代码可读性

内容的提问来源于stack exchange，提问作者countmegabaron