ajax配合json页面显示

在现代Web应用开发中，AJAX是一种重要的技术。它可以让Web页面在无需刷新的情况下，与服务器进行数据交换，从而实现动态更新页面的效果。而JSON则是一种轻量级的数据交换格式，通常用于AJAX返回数据的格式。

下面是一个用AJAX和JSON实现动态加载数据的示例代码：

function loadData() {
  $.ajax({
    url: 'http://example.com/data',dataType: 'json',success: function(data) {
      $.each(data,function(idx,item) {
        $('<li><a href="' + item.url + '">' + item.title + '</a></li>').appendTo('#news-list');
      });
    }
  });
}

上面的代码使用了jQuery库提供的$.ajax()函数，来向服务器请求数据。参数url指定了数据的来源地址，dataType指定了接收的数据格式为JSON。在成功获取到数据后，通过$.each()函数来遍历JSON数组，并将每个数据项生成一个HTML链接元素，并追加到页面上的新闻列表中。

在页面中，可以先创建一个空的&ltp>元素，用于显示动态加载的数据：

<ul id="news-list"></ul>

在页面加载时，可以调用loadData()函数，来初始化页面数据：

<script>
$(function() {
  loadData();
});
</script>

通过这种方式，就可以快速地实现一个动态加载数据的页面。