代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> </title>
<style type="text/css">
ul {
border: 1px black solid;
}
ul li {
display: flex;
justify-content: space-around;
border: 1px pink solid;
}
</style>
</head>
<body>
<h1>各地区汇总数量</h1>
<ul id="ul">
<li> <span></span> <i></i> </li>
</ul>
</body>
<script type="text/javascript">
var newarr = [];
fetch('./1.json')
.then(response => response.json())
.then(data => {
var newstr = data.data.detail
newstr.forEach((item, index) => {
// console.log(item.cities);
var totlenum = 0;
item.cities.forEach((item) => {
return totlenum += item.confirmedCount
})
newarr.push({
"provinceName": item.provinceName,
"totlenum": totlenum
})
})
let html = '';
newarr.forEach((item, index) => {
html += `<li> <span>${item. provinceName}</span> <span>${item. totlenum}</span> </li> `
})
document.getElementById('ul').innerHTML = html
console.log(newarr); // 下图 52 行打印
})
console.log(newarr); // 下图 55 行打印
</script>
</html>
问题1: then 内的数据可以渲染使用。 外边的数据不可以使用( 查资料说是异步的问题 )
相同点是: 点开都有数据。
不同点: 是浏览器上的展现形式不一样。一个 [] 一个[34]
谁能说个123来 …
2. 数组 prote上有个Aray(0) , 而对象上没有。 这是什么意思