ajax传参json显示页面

当我们需要在网页上动态显示数据的时候，一种常见的方法就是使用Ajax来传递参数并获取服务器返回的数据。其中，传递的参数通常都是以JSON格式进行编码并通过HTTP请求发送到服务器。

在网页中使用Ajax传递JSON参数的过程一般包括以下几个步骤：

1. 创建XMLHttpRequest对象
var xhr = new XMLHttpRequest(); 
2. 指定请求方式和请求地址
xhr.open("POST","http://www.example.com/api");
xhr.setRequestHeader("Content-Type","application/json;charset=UTF-8");
3. 设置数据格式为JSON
var data = {
    "username":"test","password":"123456"
};
var sendData = JSON.stringify(data);
4. 发送请求
xhr.send(sendData);
5. 接收服务器返回的数据，并更新页面
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
        if (xhr.status == 200) {
            var result = JSON.parse(xhr.responseText);
            document.getElementById("content").innerHTML = result.data;
        }
    }
};

以上就是使用Ajax传递JSON参数并显示返回数据的基本过程。其中，需要注意的是，发送的数据格式必须严格按照JSON格式进行编码，同时需要在请求头中指定请求数据的数据格式。