js ajax webservice,示例代码

1、Ajax是一种用于创建动态网页的技术，它可以在不重新加载整个网页的情况下更新部分网页内容。其中，Ajax中的"X"代表XML，但实际上，现代的Ajax通常使用JSON来传输数据。在使用Ajax时，我们可以通过JavaScript中的XMLHttpRequest对象来与服务器进行通信，从而实现异步加载数据并更新网页内容。

示例代码如下所示，首先创建一个XMLHttpRequest对象，然后通过该对象的open方法指定要发送的请求类型、URL和是否异步。接着，我们可以通过onreadystatechange事件来监听服务器响应的状态，当服务器响应成功时，我们可以通过responseText或responseXML属性获取服务器返回的数据。我们可以通过send方法发送请求。

var xhttp = new XMLHttpRequest();
xhttp.open("GET", "webservice.php", true);
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    var response = JSON.parse(this.responseText);
    document.getElementById("result").innerHTML = response.message;
  }
};
xhttp.send();

在上述示例代码中，我们使用了GET请求方法，请求的URL为"webservice.php"。当服务器响应成功时，我们将服务器返回的数据解析为JSON格式，并将其中的message属性的值更新到id为"result"的元素中。

2、Webservice是一种基于Web的服务，它通过HTTP协议来提供跨平台的数据交互。在前端开发中，我们可以使用Ajax来调用Webservice，从而获取并处理服务器端的数据。

示例代码如下所示，我们首先创建一个XMLHttpRequest对象，然后通过该对象的open方法指定要发送的请求类型、URL和是否异步。接着，我们可以通过设置请求头的Content-Type属性为"application/json"来指定请求的数据格式。然后，我们可以通过onreadystatechange事件来监听服务器响应的状态，当服务器响应成功时，我们可以通过responseText或responseXML属性获取服务器返回的数据。我们可以通过send方法发送请求。

var xhttp = new XMLHttpRequest();
xhttp.open("POST", "webservice.php", true);
xhttp.setRequestHeader("Content-Type", "application/json");
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    var response = JSON.parse(this.responseText);
    document.getElementById("result").innerHTML = response.message;
  }
};
var data = JSON.stringify({ "name": "John", "age": 30 });
xhttp.send(data);

在上述示例代码中，我们使用了POST请求方法，请求的URL为"webservice.php"。我们将请求的数据以JSON格式进行序列化，并通过send方法发送到服务器。当服务器响应成功时，我们将服务器返回的数据解析为JSON格式，并将其中的message属性的值更新到id为"result"的元素中。

这就是使用Ajax调用Webservice的基本示例代码。通过这种方式，我们可以实现与服务器的异步通信，获取并处理服务器端的数据，从而实现动态的网页内容更新。