專案--點選按鈕顯示資料，點選空白處隱藏資料
阿新 • • 發佈：2018-12-15
點選空白處隱藏資料
在這裡插入程式碼片
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="顯示個人資料" name="" " id="btn "> <ul id="box "> <li>姓名：劉德華</li> <li>職業：演員</li> <li>作品：無間道</li> </ul> </body> </html> <script> //點選按鈕顯示資料，點選空白處隱藏資料 function $id(id) { return document.getElementById(id); } window.onload = function () { $id("box ").style.display = "none " } $id("btn ").onclick = function (e) { var e = e || event; $id("box ").style.display = "block "; //因為boxs是document的子元素 --阻止事件流 e.stopPropagation(); } document.onclick = function () { $id("box ").style.display = "none " } </script>