<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
.li-title{
background:#eee;
}
li a:hover{
cursor:pointer;
color:red;
}
p{
display:none;
}
</style>
</head>
<body>
<script>
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
var json = (JSON.parse(xhr.responseText))['data'];
var len = json.length;
var oL = document.createElement('ol');
for(var i=0;i<len;i++){
var txt = document.createTextNode(json[i]['title']);
var e = document.createElement('li');
var p = document.createElement('p');
e.className = 'li-title';
e.innerHTML = '<a>' +'<h4>' + json[i]['title'] + '</h4>' + '</a>';
e.appendChild(p);
document.body.appendChild(oL);
oL.appendChild(e);
}
}
return json;
};
xhr.open('GET','https://cnodejs.org/api/v1/topics',false);
xhr.send();
console.log(json);
var tabli = document.querySelectorAll('li');
tabli.forEach(function(li){
li.addEventListener('click',function(e){
var target = e.target;
var index = [].indexOf.call(tabli,target);
console.log(index);
});
})
</script>
</body>
</html>
为什么index和json都打印不出来呢?
相关分类