let list=document.getElementById('list');
// 请求服务器获取数据 动态渲染
let xhr= new XMLHttpRequest();
xhr.open("GET","http://jsonplaceholder.typicode.com/users");
xhr.send();
xhr.onreadystatechange=function () {
if (xhr.readyState==4 && xhr.status==200){
// console.log(xhr.responseText);//这时候是字符串类型 因为前后端传输只能是字符串类型
let data=JSON.parse(xhr.responseText);
// console.log(data instanceof Array);//转换为数组类型
data.forEach((item,index)=>{
let liEle=document.createElement('li');
liEle.innerHTML=`姓名:${item.name}----邮箱:${item.email}`;
list.append(liEle);
})
// 给li循环绑定事件
// 但是当页面开始还没有创建li元素
let sublist=document.getElementsByTagName('li');
// console.log(typeof sublist)// Object
// console.log(sublist instanceof Array)//false
for (let i=0;i
sublist[i].addEventListener("click", function () {
// 在此绑定事件时 单击事件需要向服务端发起请求 获取相对应的值
// 返回来的值是responseText 并且转换了数组赋给data data中存的还是对象
console.log(data[i].name);// 所以对象.属性 获取到值
})
}
}
}