使用原生js实现以下效果：点击容器内的图标，图标边框变成border:1px solid red，点击空白处重置

参考答案

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';
   }
 }
}