HTML5天氣預報代碼視頻是一種通過HTML5技術開發(fā)的在線天氣預報應用。它可以幫助用戶在網(wǎng)頁上實時了解天氣情況，幫助人們更好地計劃日常活動。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>天氣預報</title>
</head>
<body>
<h1>今日天氣預報</h1>
<div>
<label>城市: </label>
<input type="text" id="city" name="city">
<button type="button" onclick="searchWeather()">查詢</button>
</div>
<div id="result">
<p>最新天氣預報信息將在這里顯示。</p>
</div>
<script>
function searchWeather() {
var url="https://api.openweathermap.org/data/2.5/weather?q=";
var apiKey="&appid=your_api_key";
var city=document.getElementById("city").value;
var completeUrl=url+city+apiKey;
var xhr=new XMLHttpRequest();
xhr.onreadystatechange=function() {
if (xhr.readyState==4 && xhr.status==200) {
var result=JSON.parse(xhr.responseText);
var description=result.weather[0].description;
var temperature=Math.round(result.main.temp-273.15)+"°C";
var humidity=result.main.humidity+"%";
var wind=result.wind.speed+"m/s";
var displayText="天氣："+description+"<br>"+
"溫度："+temperature+"<br>"+
"濕度："+humidity+"<br>"+
"風速："+wind;
document.getElementById("result").innerHTML=<p><strong>"+city+"</strong>："+displayText+"</p>;
}
};
xhr.open("GET",completeUrl,true);
xhr.send();
}
</script>
</body>
</html>這段代碼使用了XMLHttpRequest對象來發(fā)送HTTP請求獲取天氣預報信息，接著使用JSON.parse()方法解析返回的JSON數(shù)據(jù)。最后，將解析后的天氣信息顯示在頁面上。