outline属性怎么去除外边框，怎么获取事件

问题遇到的现象和发生背景

按钮上有黑色边框，点击任意地方边框消失，怎么能捕获到该事件，

运行结果及报错内容

img

我的解答思路和尝试过的方法

给按钮加 outline: none;样式

我想要达到的结果

期望效果不要有黑色边框

img

这个你也说了，那是有黑圈之后，点其他地方消失，那就是 focus 伪类元素的样式

:focus { outline: none; border: 0; box-shadow: none; }

给 body加 点击事件 。然后 在点击事件里去除 边框

outline: none; 是点击时出现的边框效果，你试着设置一下border：none


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button>X</button>
    <script>
        var html = document.querySelector("html");
        var btn = document.querySelector("button");
        html.onclick = function() {
            btn.style.border = "none";
        }
    </script>
</body>
</html>