一、前言
1、目前引入天气预报的初衷仅仅是修饰页面而已,使网页稍微有点时代感,亲切感、体贴感。
2、全部前端引入,一句代码而已
二、效果
①初步显示
![](https://img.laitimes.com/img/_0nNw4CM6IyYiwiM6ICdiwiI0NXYFhGd192UvwVe0lmdhJ3ZvwFM38CXlZHbvN3cpR2Lc1TPB10QGtWUCpEMJ9CXsxWam9CXwADNvwVZ6l2c052bm9CXUJDT1wkNhVzLcRnbvZ2Lc1TPR5UeWJjW5Z0RiZXUYpVd1kmYr50MZV3YyI2cKJDT29GRjBjUIF2LcRHelR3LcJzLctmch1mclRXY39DMyQDM0ITN1EDMxMDM4EDMy8CX0Vmbu4GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.jpg)
②修改地区,如点击图中的湛江,进入如下页面
修改为北京
点击确定,如下图
③查看天气预报详情,点击其他位置即可
三、代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>天气预报</title>
</head>
<body>
<!--就这一句代码-->
<iframe width="420" scrolling="no" height="600" frameborder="0" allowtransparency="true" src="http://i.tianqi.com/index.php?c=code&id=12&icon=1&num=5"></iframe>
</body>
</html>
四、小结
天气预报的接口有很多,但是个人感觉简单、易用、好使就是最好的