要求点击之后li元素的内容被替换
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<ul>
<li src="./resource/1.txt">1</li>
<li src="./resource/2.txt">2</li>
<li src="./resource/3.txt">3</li>
</ul>
<button type="button" id="but">点击</button>
</body>
<script type="text/javascript" src="jq.js">
</script>
<script type="text/javascript">
let but = document.querySelector("#but");
but.onclick = function() {
var list = Array.from(document.getElementsByTagName("ul")[0].children);
((list) => {
list.forEach(async function(item) {
let url = item.getAttribute("src");
let data = await fetch(url);
data = await data.text();
item.innerHTML = data;
})
})(list)
}
</script>
</html>