JSFiddle - React, Tailwind, and code Playground

HTML

<input type="button" value="按钮" id="btn1">
<div id="div1">点击按钮div就出现,点击除按钮以外的部分div就消失</div>

CSS

#div1{
            width:100px;
            height:200px;
            border:1px solid red;
            display: none;
        }

JavaScript

var oBtn=document.getElementById('btn1');
            var oDiv=document.getElementById('div1');

            oBtn.onclick=function(ev){
                var oEvent=ev||event;
                //阻止当前事件函数事件冒泡
                oEvent.cancelBubble=true;
                oDiv.style.display='block';
            }
            document.onclick=function(){              
                oDiv.style.display='none';
            }