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