javascript - 使用innerHTML设置段落的值不起作用

innerHTML在此JavaScript代码中不起作用。

var date = new Date();
var time = date.getHours();
var morning = document.p.getElementById("greeting").innerHTML="Good Morning ";
var afternoon = document.write =  "Good Afternoon ";
var evening = document.write = "Good evening";

if (time < 12){
    morning}
else if (time < 18){
afternoon}
else {evening};

HTML代码是

<p id="greeting"> </p>

我试图根据时间将代码读取为“早上好”或“下午”。 JavaScript在外部文件中。它与document.write一起使用，但是在外部文件中，问候语显示在页面顶部。

在这里，我尝试根据一天中的时间设置“问候”。

最佳答案

var afternoon = document.write = "Good afternoon";

这样做的作用是引入一个名为afternoon的变量，并将变量和以前是函数调用的write上的属性document都设置为字符串"Good afternoon"。

在代码的稍后部分，您只需编写afternoon，即可访问变量，但不对其执行任何操作。

看来您想执行以下操作：

var morning = function() { document.getElementById("greeting").innerHTML="Good Morning "; };
var afternoon = function() { document.getElementById("greeting").innerHTML="Good Afternoon "; };
var evening = function() { document.getElementById("greeting").innerHTML="Good evening"; };

if (time < 12) {
   morning();
} else if (time < 18) {
   afternoon();
} else {
   evening();
};

也就是说，以上内容与您的代码最接近，这是正确的。我仍然要说还有改进的余地。如下所示对我来说更有意义：

var morning = 'Good Morning ';
var afternoon = 'Good Afternoon ';
var evening = 'Good evening';

if(time < 12) {
    document.getElementById("greeting").innerHTML = morning;
} else if (time < 18) {
    document.getElementById("greeting").innerHTML = afternoon;
} else {
    document.getElementById("greeting").innerHTML = evening;
}

更好的是，您可能会先决定要使用的消息，然后再对其进行分配，如果您想更改输出问候语的位置，那么这将为您提供更少的更改代码的位置，例如：

var messages = {
   morning: 'Good Morning ',
   afternoon: 'Good Afternoon ',
   evening: 'Good evening'
};

var greeting = time < 12
    ? messages.morning
    : time < 18
        ? messages.afternoon
        : messages.evening;

document.getElementById('greeting').innerHTML = greeting;