AJAX
AJAX 不是新的编程语言,而是一种使用现有标准的新方法。
AJAX 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。
AJAX 不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行。
AJAX实例
点击修改内容后:
课程天气系统设计
< !DOCTYPE html >
< html >
< head >
< meta charset=“utf-8” / >
< title >城市天气系统< /title >
< script src=“https://cdn.xxxxx/jquery/1.10.2/jquery.min.js”>
<script>
document.addEventListener('plusready', function(){
});
$(document).ready(function() {
$("button").click(function() {
var city = $("#city").val();
$.ajax({
type: "GET", //请求方式
url: "http://wthrcdn.etouch.cn/weather_mini?city="+city,
dataType: "json",
success: function(result){
addBox(result.data.forecast);
}
});
});
});
function addBox(json_data) {
$.each(json_data, function(index, obj) {
$("#box").append("<div'>" +
"<p>" + obj['date'] + "</p>" +
"<p>" + obj['high'] + "</p>" +
"<p>" + obj['fengli'] + "</p>" +
"<p>" + obj['low'] + "</p>" +
"<p>" + obj['fengxiang'] + "</p>" +
"<p>" + obj['type'] + "</p>" +
"</div>");
});
}
</script>
</head>
<body>
<div>
<h3>请输入城市:</h3>
城市:<input type="text" id="city"/>
<br>
<button type="button">提交</button>
</div>
<br>
<div id="box"></div>
</body>