天气

最新推荐文章于 2021-12-15 02:16:07 发布

ForrestGumpZHanG

最新推荐文章于 2021-12-15 02:16:07 发布

阅读量148

点赞数

分类专栏：高德地图

本文链接：https://blog.csdn.net/qq_36026747/article/details/80886105

版权

高德地图专栏收录该内容

16 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>天气信息查询</title>   
    <style type="text/css">
        
        .weather{
            width: 60px;
            padding-left: 8px;
            display: inline-block;
        }
        
		#tip {
			background-color: #fff;
			padding-left: 10px;
			padding-right: 10px;
			position: absolute;
			font-size: 10px;
			right:0px;
			top: 0px;
			border-radius: 3px;
			border: 1px solid #ccc;
			line-height: 30px;
		}


    </style>
    
</head>
<body>
    
<div id="tip" style="line-height: 12px"></div>
    
<script src="http://webapi.amap.com/maps?v=1.4.2&key=6202c32e3dccbecd6d7251d9f396db30&plugin=AMap.PolyEditor,AMap.CircleEditor,AMap.MouseTool,AMap.ToolBar,AMap.Driving"></script>
<script type="text/javascript" src='http://webapi.amap.com/maps?v=1.4.6&key=6202c32e3dccbecd6d7251d9f396db30&plugin=AMap.TruckDriving'></script> 
<script type="text/javascript" src="http://139.224.44.115:8010/Resource/js/jquery-2.0.0.min.js"></script>
<script type="text/javascript">
weather()
    function weather()//天气查询方法
{
    var xmlhttp;
    if (window.XMLHttpRequest)
    {
        //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlhttp=new XMLHttpRequest();
    }
    else
    {
        // IE6, IE5 浏览器执行代码
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
             //此句返回天气查询原始json数据
			 debugger
            var weatherinfo = xmlhttp.responseText;
            var text = JSON.parse(weatherinfo);
            var data = text.lives[0]; 
            var str = [];
             
                str.push('<div>城市/区：' + data.city + '</div>');
                str.push('<div>天气：' + data.weather + '</div>');
                str.push('<div>温度：' + data.temperature + '℃</div>');
                str.push('<div>风向：' + data.winddirection + '</div>');
                str.push('<div>风力等级：' + data.windpower + '</div>');
                str.push('<div>空气湿度：' + data.humidity + '</div>');
                str.push('<div>发布时间：' + data.reporttime + '</div>');
                document.getElementById('tip').innerHTML = str.join('<br>');
             
            //data数据类型为json  实例：
            // {"province" :"北京",
            //"city" :"东城区",
            //"adcode" :"110101",
            // "weather" :"晴",
            // "temperature" :"23",
            // "winddirection" :"北",
            // "windpower" :"9",
            // "humidity" :"15",
            //"reporttime" :"2017-04-18 16:00:00"}

        }
    }
    xmlhttp.open("GET","http://restapi.amap.com/v3/weather/weatherInfo?key=b90d81e4db390ecc709454bd5b30d487&address&city=310000",true);
    xmlhttp.send();
}

            
           
      

</script>
</body>
</html>

ForrestGumpZHanG

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
天气

&lt;!doctype html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;天气信息查询&lt;/title&gt; &lt;style type="text/css"&gt; .weathe
复制链接

扫一扫