<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
.b2 {
color: coral;
}
.info{
color: aqua;
}
</style>
</head>
<body>
<button id="b1"> 点击 </button>
<button class="b2"> 还原 </button>
<div class="info"> 这是一段文字</div>
</body>
<script>
//获取所有id为“b1”的元素，并将它们存储在名为“elements”的变量中
let btn1 = document.getElementById("b1");
btn1.addEventListener("click", change);
function change() {
//遍历所有class为“info”的元素,修改其中的文本和字体颜色，并在其中加入一个a标签链接
let elements = document.getElementsByClassName("info");
for (let element of elements) {
element.innerText = "这是一段新的文字";
element.style.color = "red";
let newA = document.createElement("a");
newA.href = "https://www.baidu.com";
newA.innerText = "百度";
newA.style.marginLeft = "100px";
newA.target = "_blank";
element.appendChild(newA);
}
}
//还原
let btn2 = document.getElementsByClassName("b2");
btn2.addEventListener("click",reset);
function reset() {
let infoDiv = document.getElementsByClassName("info");
infoDiv.innerText = "这是一段文字";
infoDiv.style.color = "aqua";
}
</script>
</html>
43 行提示 btn2.addEventListener 不是个方法，这就有点离谱了。
