龙空技术网

ajax——请求github接口

北漂佳佳的生活 276

前言:

而今朋友们对“div布局ajax链接”大约比较关注,大家都需要了解一些“div布局ajax链接”的相关知识。那么小编同时在网上收集了一些关于“div布局ajax链接””的相关文章,希望小伙伴们能喜欢,大家一起来学习一下吧!

<style>

.user{ display: flex; background: #f4f4f4; padding: 10px; margin-bottom: 10px; }

.user ul{ list-style: none; }

</style>

<button id="button">请求github接口</button>

<br><br>

<h1>所有github的用户信息</h1>

<div id="show"></div>

document.getElementById('button').addEventListener("click",loadUser);

function loadUser(){

var xhr=new XMLHttpRequest();

xhr.open("GET","",true);

xhr.onload=function(){

if(this.status==200){

var users=JSON.parse(this.responseText);

console.log(users[0].login);

var output='';

for(var i in users){

output+=`

<div class="user"><img src="${users[i].avatar_url}" width="70" height="70">

<ul>

<li>ID:${users[i].id}</li>

<li>Login:${users[i].login}</li>

</ul>

</div>

`;

}

document.getElementById('show').innerHTML=output;

}

}

xhr.send();

}

标签: #div布局ajax链接 #ajax用户接口 #ajax微信公众平台接口