js03_dom.html 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>dom</title>
  6. </head>
  7. <body>
  8. <button id="btn1">删除</button>
  9. <div id="printText">
  10. </div>
  11. <button id="start">开始</button>
  12. <button id="end">结束</button>
  13. </body>
  14. <script>
  15. //弹出框
  16. //alert("消息提示")
  17. document.getElementById("btn1").onclick = function (){
  18. //确认框
  19. let bool = confirm("确认删除吗?")
  20. if (bool){
  21. console.log("确认删除")
  22. }else{
  23. console.log("取消删除")
  24. }
  25. }
  26. //函数
  27. function print(){
  28. let element = document.getElementById("printText");
  29. //innerHtml 内容
  30. element.innerHTML = "";
  31. element.innerHTML = Math.random();
  32. }
  33. let flag
  34. document.getElementById("start").onclick = function (){
  35. //时间 循环执行 参数1 函数 参数2 时间
  36. //返回值 定时器标识
  37. flag = setInterval( print , 1000)
  38. }
  39. document.getElementById("end").onclick = function (){
  40. //清除定时器
  41. clearInterval(flag)
  42. }
  43. /*
  44. setInterval 定时器 执行多次
  45. 参数1 函数 参数2 执行周期
  46. clearInterval 清除定时器 标识 停止
  47. */
  48. //固定 执行时间 执行一次
  49. //参数1 函数
  50. //参数2 时间
  51. setTimeout(function (){
  52. console.log("执行一次")
  53. },5000)
  54. /*
  55. 练习
  56. 倒数10个数。
  57. 开始 按钮 10 9 8 7 1 .
  58. 输出 比赛结束。
  59. */
  60. </script>
  61. </html>