JavaScript学习笔记:1、调试和隐藏元素
2016-03-15 23:45
609 查看
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <title>Test Confirm</title> </head> <body> <h1>Test Confirm</h1> Hello <button onclick="hide(this, true)">Hide1</button> <button onclick="hide(this, false)">Hide2</button> world </body> <script> function moveon(){ var answer = confirm("Confirm ?"); //弹出确认框 console.log("answer:"+answer); if (answer) { hide(document.getElementById("debuglog"),true); } } //定时器,毫秒为单位 setTimeout(moveon, 6000); function hide(e, reflow) { if (reflow) { e.style.display = "none"; //隐藏元素,其所占用的空间也随之消失 } else { e.style.visibility = "hidden"; //仅仅是让元素不可见,空间还在 } } //给页面添加调试信息 function debug(msg) { var log = document.getElementById("debuglog"); if (!log) { log = document.createElement("div"); log.id = "debuglog"; log.style.color = "red"; log.innerHTML = "<h1>Debug log</h1>"; document.body.appendChild(log); } var pre = document.createElement("pre"); var text = document.createTextNode(msg); pre.appendChild(text); log.appendChild(pre); } debug("Test debug"); </script> </html>