AJAX用于异步请求。AJAX = 异步 JavaScript 和 XML。
AJAX 是一种用于创建快速动态网页的技术。AJAX 可以使在不重新加载整个网页的情况下，对网页的某部分进行更新。
XMLHttpRequest对象，用于后台和数据库的交换。
代码为
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ajax 请求Github真实api接口</title>
<style type="text/css">
.user{
background: #f4f4f4; padding: 10px; margin-bottom: 10px; height:100px;
}
.user img{margin-right:20px; display:inline}
</style>
</head>
<body>
<button id="button">请求Github接口</button>
<h1>所以用户信息</h1>
<div id="users"></div>
<script type="text/javascript">
document.getElementById('button').addEventListener("click",loadusers);
function loadusers(){
var xhr=new XMLHttpRequest();
xhr.open("GET","https://api.github.com/users",true);
xhr.onload=function(){
if(this.status == 200){
var users=JSON.parse(this.responseText);
var output='';
for (var i in users ) {
output+="<div class='user'>"+"<img src='"+users[i].avatar_url+" ' width='70' height='70' /> "+users[i].url+"</div>";
}
document.getElementById("users").innerHTML=output;
}
}
xhr.send();
}
</script>
</body>
</html>
Github
网友评论