【JS模块】document.onclick
浏览数：26 /
时间：2015年06月09日
<!doctype html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="box1" style="background:red"> <button id="btn1">btn1</button> <button id="btn2">btn2</button> </div> <div id="box2" style="background:green">box2</div> <a id="link1" href="" target="_blank">link1</a> <button id="btn3">btn3</button> <script> var box1 = document.getElementById(‘box1‘) var box2 = document.getElementById(‘box2‘) box1.onclick = function(e) { /** * 点击btn1 * e.target 实际触发事件的对象 * e.currentTarget 事件监听的对象 */ console.log(e.target) // btn1 console.log(e.currentTarget) // box1 box2.style.display = ‘block‘ } var els = box1.getElementsByTagName(‘*‘) // ‘*‘ box1下全部子元素 document.onclick = function(e) { if (e.target === box1) { return; } for (var i = 0, l = els.length; i < l; i++) { if (e.target === els[i]) { return; } } box2.style.display = ‘none‘ } </script> </body> </html>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
