const box = document.getElementById("box");
function isIcon(target) {
return target.className.includes("icon");
}
box.onclick = function (e) {
e.stopPropagation();
const target = e.target;
if (isIcon(target)) {
target.style.border = "1px solid red";
}
};
const doc = document;
doc.onclick = function (e) {
const children = box.children;
for (let i = 0; i < children.length; i++) {
if (isIcon(children[i])) {
children[i].style.border = "none";
}
}
};
使用原生js实现以下效果:点击容器内的图标,图标边框变成border:1px solid red,点击空白处重置
Posted on:2022年10月30日 at 11:13