JavaScript通过API调取信息，AJAX请求，局部刷新

AJAX是网页异步刷新、局部刷新

AJAX = 异步 JavaScript 和 XML。
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

代码部分

<script language="javascript" type="text/javascript">   
    var xmlHttpRequest;  //定义一个变量用于存放XMLHttpRequest对象
    var API_message;     //定义储存API返回信息的变量
    //定义一个用于创建XMLHttpRequest对象的函数
    function createXMLHttpRequest(){
        if(window.ActiveXObject){//IE浏览器的创建方式
            xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
        }else if(window.XMLHttpRequest){//Netscape浏览器中的创建方式
            xmlHttpRequest = new XMLHttpRequest();
        }  //这里主要是为了兼容老的浏览器
    }
    //响应HTTP请求状态变化的函数
    function httpStateChange(){
        if(xmlHttpRequest.readyState == 4){//判断异步调用是否成功,若成功开始局部更新数据
            if(xmlHttpRequest.status == 200||xmlHttpRequest.status == 0) {
                API_message = JSON.parse(xmlHttpRequest .responseText);
                    //xmlHttpRequest .responseText是接口返回的数据，一般为json格式
                    //JSON.parse()  将格式完好的json字符串转换为json对象。
                    //API_message里包含了API返回的信息，且已经处理为json对象，
                    //在之后的程序里可以直接使用
            } else {//如果异步调用未成功,弹出警告框,并显示出错信息
                alert("error:HTTP状态码为:"+xmlHttpRequest.status + ",HTTP状态信息为:" + xmlHttpRequest.statusText);
            }
        }
    }
    //异步调用服务器段数据
    function getData(name,value){ 
        createXMLHttpRequest();//创建XMLHttpRequest对象
        if(xmlHttpRequest != null){     
            xmlHttpRequest.open("get","your_url/API",true);//创建HTTP请求
            xmlHttpRequest.onreadystatechange = httpStateChange;//HTTP请求状态变化的函数
            //每当 readyState 改变时，就会触发 onreadystatechange 事件，链接到后面的函数名 
            xmlHttpRequest.send(null);//发送请求
        }
        
    }
</script>

xmlHttpRequest的一些属性

API的获取可以通过查询提供方的开发文档获得

在我们调用API获取返回数据时，我们需要对API返回的数据结构有一个清晰的认知，才能方便我们更好的使用。

一般在所需要调用的API官网的开发文档中会有详细的说明。（心知天气的文档示例）