武汉市委统战部-首页

搜站内索 加入收藏

天气时间

这个网站提供了一个便捷的方式来获取实时的天气和时间信息。使用 publicWeather() 函数,你可以轻松地显示当前日期、星期以及天气状况等详细信息。以下是函数中使用的变量说明:

  • :表示当前日期的年份、月份和日期。
  • :表示当前日期所在的星期几。
  • 图标:表示天气状况的图标,比如晴、雨等。
  • 天气:表示当前天气状况的文字描述。
  • 气温:表示当前气温的数值。
  • 城市:表示当前所在的城市名称。

函数通过发送POST请求到 /home/getweather 接口来获取天气信息。如果返回的消息为 “ok”,则将相应的变量替换到 HTML 模板中。最终生成的 HTML 字符串可以在网页中展示出来,从而实现实时天气信息的展示功能。

要使用 publicWeather() 函数,你需要在代码中引入 jQuery 库(因为使用了 $.post() 方法)。然后调用该函数,并传入相应的参数值,就可以在页面上展示出天气和时间信息了。以下是一个示例:

<div id="weather"></div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
function publicWeather() {
var html = '<span style="margin-right: 16px;">{年}年{月}月{日}日</span><span id="index-week" style="margin-right: 16px;">{周}</span><span style="margin-right: 16px;"><img src="../../Content/images/weather/{图标}.png" width="21px" height="21px" style="vertical-align: top;margin-right: 4px;">{天气}</span><span style="margin-right: 16px;">{气温}°C</span><span>{城市}</span>';
$.post('/home/getweather', function (r) {
if (r.msg == 'ok') {
html = html.replace('{年}', r.year);
html = html.replace('{月}', r.month);
html = html.replace('{日}', r.day);
html = html.replace('{周}', r.week);
html = html.replace('{图标}', r.icon);
html = html.replace('{天气}', r.weather);
html = html.replace('{气温}', r.temperature);
html = html.replace('{城市}', r.city);
$('#weather').html(html);
} else {
console.log('Failed to retrieve weather information!');
}
});
}
$(document).ready(function() {
publicWeather();
});
</script>

以上代码将在网页中的 <div id="weather"></div>