天气预报demo

ZZZ --- jh

于 2020-11-04 09:19:03 发布

阅读量255

点赞数 2

分类专栏： ajax demo 文章标签： ajax

本文链接：https://blog.csdn.net/ZZZ___jh/article/details/109483757

版权

demo 同时被 2 个专栏收录

19 篇文章 0 订阅

订阅专栏

ajax

6 篇文章 0 订阅

订阅专栏

天气预报demo

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>天气预报</title>
    <script>
        function tianqi(da){
            console.log(da)
            console.log(da.data.city)
            console.log(da.data.wendu)
            console.log(da.data.ganmao)
        }
    </script>
</head>
<body>
    <div>
        <h1>天气预告</h1>
        <input type="text">
        <button id='cha'>查询</button>
    </div>
    <script>
        var but1 = document.getElementById('cha');
        var input1 = document.getElementsByTagName('input')[0];
        but1.onclick=function(){
            var a = input1.value;
            var scr1 = document.createElement('script');
            scr1.src= `http://wthrcdn.etouch.cn/weather_mini?city=${a}&callback=tianqi`;
            document.body.append(scr1);
        }
    </script>
</body>
</html>