example01.html 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title></title>
  6. <style>
  7. h1 { font: 72px arial; }
  8. #bar { color: red; }
  9. .foo { color: green; }
  10. h1 { color: blue !important; }
  11. #timer {
  12. width: 250px;
  13. height: 30px;
  14. line-height: 30px;
  15. text-align: center;
  16. color: yellow;
  17. background-color: blue;
  18. float: right;
  19. }
  20. </style>
  21. </head>
  22. <body>
  23. <div id="timer"></div>
  24. <h1 id="bar" class="foo">Hello, world!</h1>
  25. <button onclick="shutdown()">关闭</button>
  26. <button onclick="openBaidu()">打开百度</button>
  27. <script>
  28. function openBaidu() {
  29. window.open('https://www.baidu.com', '',
  30. 'width=300,height=200');
  31. }
  32. function shutdown() {
  33. if (window.confirm('确定要退出吗?')) {
  34. window.close();
  35. }
  36. }
  37. var weekdays = ['日', '一', '二', '三', '四', '五', '六'];
  38. function showTime() {
  39. var now = new Date();
  40. var year = now.getFullYear();
  41. var month = now.getMonth() + 1;
  42. var date = now.getDate();
  43. var hour = now.getHours();
  44. var minute = now.getMinutes();
  45. var second = now.getSeconds();
  46. var day = now.getDay();
  47. var timeStr = year + '年' +
  48. (month < 10 ? '0' : '') + month + '月' +
  49. (date < 10 ? '0' : '') + date + '日 ' +
  50. (hour < 10 ? '0' : '') + hour + ':' +
  51. (minute < 10 ? '0' : '') + minute + ':' +
  52. (second < 10 ? '0' : '') + second +
  53. ' 星期<b>' + weekdays[day] + '</b>';
  54. var div = document.getElementById('timer');
  55. div.innerHTML = timeStr;
  56. }
  57. showTime();
  58. window.setInterval(showTime, 1000);
  59. // 1TBS风格 - C/Unix - Dennis M. Ritchie
  60. // Allman风格 - FreeBSD - Allman
  61. // while循环 / do-while循环 / for循环
  62. // while循环 - 不确定循环的次数
  63. // for循环 - 循环的次数是确定的
  64. // do-while循环 - 至少执行一次
  65. // var flag = true;
  66. // do {
  67. // var yearStr = window.prompt('请输入年份: ');
  68. // var year = parseInt(yearStr);
  69. // if (year == yearStr && year > 0) {
  70. // if (year % 4 == 0 && year % 100 != 0
  71. // || year % 400 == 0) {
  72. // window.alert(year + '年是闰年');
  73. // } else {
  74. // window.alert(year + '年不是闰年');
  75. // }
  76. // flag = window.confirm('是否继续?');
  77. // } else {
  78. // window.alert('请输入有效的年份!');
  79. // }
  80. // } while (flag);
  81. </script>
  82. </body>
  83. </html>