制作一个网页,实现页面打开时根据系统时间弹出窗口问安。早上7点-9点显示早安,中午11点-13点显示午安,晚上8点-10点显示晚安
时间: 2024-03-07 10:49:20 浏览: 21
好的,这个问题涉及到前端页面和JavaScript代码的编写,我会尽力回答。首先,我们需要编写一个弹出窗口的函数,代码如下:
```javascript
function showAlert(message) {
alert(message);
}
```
接下来,我们需要获取当前系统时间,可以使用JavaScript的`Date`对象来实现,代码如下:
```javascript
var now = new Date();
var hour = now.getHours();
```
然后,我们可以根据当前时间来判断需要显示的问候语,并调用弹出窗口的函数来显示问候语,代码如下:
```javascript
if (hour >= 7 && hour < 9) {
showAlert("早安");
} else if (hour >= 11 && hour < 13) {
showAlert("午安");
} else if (hour >= 20 && hour < 22) {
showAlert("晚安");
}
```
最后,我们需要在页面加载完成时自动执行上述代码,可以使用JavaScript的`window.onload`事件来实现,完整代码如下:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>问安弹窗</title>
</head>
<body>
<script>
function showAlert(message) {
alert(message);
}
var now = new Date();
var hour = now.getHours();
if (hour >= 7 && hour < 9) {
showAlert("早安");
} else if (hour >= 11 && hour < 13) {
showAlert("午安");
} else if (hour >= 20 && hour < 22) {
showAlert("晚安");
}
</script>
</body>
</html>
```
请注意,此代码仅供参考,实际实现可能需要考虑更多的细节和异常情况。
相关推荐
![](https://img-home.csdnimg.cn/images/20210720083646.png)
![doc](https://img-home.csdnimg.cn/images/20210720083327.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)