js请编写代码,实现根据系统时间显示问候语功能,通过改变div中的内容,显示不同的问候语,10时之前,显示早上好,14时之前,显示中午好,17时之前显示下午好,22时之前,显示晚上好
时间: 2024-05-03 10:20:18 浏览: 18
好的,以下是实现功能的 JavaScript 代码:
```html
<div id="greeting"></div>
<script>
function getGreeting() {
const hour = new Date().getHours();
if (hour < 10) {
return '早上好';
} else if (hour < 14) {
return '中午好';
} else if (hour < 17) {
return '下午好';
} else if (hour < 22) {
return '晚上好';
} else {
return '夜深了';
}
}
const greeting = document.getElementById('greeting');
greeting.innerText = getGreeting();
</script>
```
代码解释:
1. `getGreeting` 函数用于根据当前系统时间,生成相应的问候语。
2. `new Date().getHours()` 可以获取当前时间,精确到小时数。
3. 根据小时数,用 if/else if 条件语句判断应该显示哪个问候语。
4. 在页面中找到 `id` 为 `greeting` 的 `div` 元素。
5. 最后将 `div` 中的文本改为调用 `getGreeting` 函数返回的问候语。
希望以上代码可以满足您的需求,祝您使用愉快!