ajax: 手機歸屬地查詢
(https://tcc.taobao.com/cc/json/mobile_tel_segment.htm?tel=15850781443)
ajax: 天氣預報(心知天氣，和風天氣)
ajax: 圖靈機器人
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#panel {
width: 100%;
height: 400px;
border: 1px solid #ccc;
}
#msg {
margin-top: 10px;
width: 100%;
height: 100px;
}
</style>
<script>
window.onload = function () {
document.getElementById("btn_send").onclick = function () {
//1. 得到用戶要發送的內容
var info = document.getElementById("msg").value;
//把消息放在panel里。
document.getElementById("panel").innerHTML += '<p>我說：' + info + '</p>';
var req = new XMLHttpRequest();
req.open("post", "http://www.tuling123.com/openapi/api?key=fb6b7bcfbe52fccdb7f5d752a3088f75&info=" + info, true);
req.send();
req.onreadystatechange = function () {
if (req.readyState == 4 && req.status == 200) {
var obj = JSON.parse(req.responseText);
//把消息放在panel里。
document.getElementById("panel").innerHTML += '<p>圖靈回復：' + obj.text + '</p>';
}
}
}
}
</script>
</head>
<body>
<div id="panel">
</div>
<textarea id="msg">
</textarea>
<button type="button" id="btn_send">發送</button>
<!--</form>-->
</body>
</html>
~~~
1。注意ajax跨域訪問，在jquery階段介紹jsonp, 在servlet階段介紹服務器中轉，設置cross-origin
