我下面的 javascript 代码有什么问题？ [复制]答案

【问题标题】：What is wrong with my below code for javascript? [duplicate]我下面的 javascript 代码有什么问题？ [复制]
【发布时间】：2017-03-22 15:14:00
【问题描述】：

我想以以下格式显示日期和日期，但它不适合我。错误显示“未捕获的 TypeError：无法设置属性 'innerHTML' of null”。谁能帮我解开这个？

输出：-

今天是：星期三

当前时间是 : 8 PM :25:20

** 我的 HTML 代码：-**

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Excercise</title>
    <script src="Js\DateTimeExcercise.js">
    </script>
</head>
<body>
      Today is : <span id="day"></span>
      <br/><br/>
      Current time is : <span id="time"></span>
</body>
</html>

** 我的 Java 脚本代码：-**

var day, time, Sec, Min, Hr, AMPM;
AMPM = "AM";

day = new Date().getDay();

Sec = new Date().getSeconds();
Min = new Date().getMinutes();
Hr = new Date().getHours();

if (Hr>12)
{
  Hr = Hr - 12;
  AMPM = "PM";
}
switch(day)
{
      case 0:
      txt = "Sunday";
      break;

      case 1:
      txt = "Monday";
      break;

      case 2:
      txt = "Tueday";
      break;

      case 3:
      txt = "Wednesday";
      break;

      case 4:
      txt = "Thrusday";
      break;

      case 5:
      txt = "Friday";
      break;

      case 6:
      txt = "Saturday";
      break;

}
document.getElementById("day").innerHTML = txt;

document.getElementById("time").innerHTML = Hr + " "+ AMPM + " "+ ":" + Min + ":" + Sec;

【问题讨论】：

DOMContentLoaded.
你必须在结束

标签： javascript html

【解决方案1】：

尝试调用 html 底部的脚本。

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Excercise</title>
</head>
<body>
  Today is : <span id="day"></span>
  <br/><br/>
  Current time is : <span id="time"></span>
</body>
<script src="Js\DateTimeExcercise.js">
</script>
</html>

【讨论】：

好的，谢谢它对我有用，能解释一下脚本前后调用有什么区别吗？
@YashwantSingh 不同的是，当你先运行脚本时，页面上还不存在元素
好的，新的教训。

【解决方案2】：

在渲染 DOM 之前加载脚本。所以最好将脚本标签放在所有代码的下方，就在正文标签的上方。现在代码还找不到元素

另一种可能性是将代码包装在事件侦听器中，如下所示：

document.addEventListener("DOMContentLoaded", function()
  // your code
});

【讨论】：

感谢您的解释。