ajax瀑布流json怎么写

ajax瀑布流json是一种常用的网页展示方式，通过动态加载数据，实现页面滚动时无限加载内容。下面我们就来介绍如何使用ajax和json实现瀑布流效果。

首先，在HTML中创建用于展示数据的容器，并添加必要的样式：

  <div id="waterfall"></div>
  
  #waterfall {
    width: 900px;
    margin: 0 auto;
  }
  
  .item {
    border: 1px solid #ccc;
    margin: 5px;
    width: 300px;
    float: left;
  }

接下来，在JavaScript中定义ajax方法和解析json数据的函数：

function loadItems() {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      var items = JSON.parse(this.responseText);
      displayItems(items);
    }
  };
  xmlhttp.open("GET","items.json",true);
  xmlhttp.send();
}

function displayItems(items) {
  var html = "";
  for (var i = 0; i 

最后，在页面加载时调用loadItems()方法，即可实现瀑布流效果：

window.onload = function() {
  loadItems();
  window.onscroll = function() {
    if (document.documentElement.scrollTop + window.innerHeight + 100 > document.documentElement.scrollHeight) {
      loadItems();
    }
  }
}