原生JS和jQuery分别使用jsonp来获取“当前天气信息”

最新推荐文章于 2021-11-23 14:43:33 发布

weixin_33806300

最新推荐文章于 2021-11-23 14:43:33 发布

阅读量165

点赞数

文章标签： json javascript ViewUI

原文链接：http://www.cnblogs.com/mycognos/p/9222306.html

版权

需掌握的技能点：

　　jsonp、跨域相关等。

　　以下两种代码，均可直接运行。

1、使用原生JS：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>
    <p id="cur_year"></p>
    <div id="iciba_ds"></div>
</body>
</html>
<script type="text/javascript">
    document.getElementById("cur_year").innerHTML =new Date();

    function data(data){
        //遍历
        var description = "";
        for(var i in data.result){
            var property=data.result[i];
            description+=i+" = "+property+"<br />";
        }
        document.write(description);
    }
</script>
<script type="text/javascript" src="http://api.k780.com:88/?app=weather.today&weaid=412&&appkey=10003&sign=b59bc3ef6191eb9f747dd4e83c99f2a4&format=json&jsoncallback=data"></script>

2、使用jquery：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="jquery-3.3.1.min.js"></script>
    <script>
        $(document).ready(function(){
            $.ajax({
                type          : 'get',
                async         : false,
                url           : 'http://api.k780.com/?app=weather.today&weaid=412&appkey=10003&sign=b59bc3ef6191eb9f747dd4e83c99f2a4&format=json&jsoncallback=data',
                dataType      : 'jsonp',
                jsonp         : 'callback',
                jsonpCallback : 'data',
                success       : function(data){
                    if(data.success!='1'){
                        alert(data.msgid+' '+data.msg);
                        exit;
                    }
                    //遍历
                    var description = "";
                    for(var i in data.result){
                        var property=data.result[i];
                        description+=i+" = "+property+"<br />";
                    }
                    document.write(description);
                },
                error:function(){
                    alert('fail');
                }
            });
        });
    </script>
</head>
<body>
</body>
</html>

转载于:https://www.cnblogs.com/mycognos/p/9222306.html

weixin_33806300

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
原生JS和jQuery分别使用jsonp来获取“当前天气信息”

需掌握的技能点：　　jsonp、跨域相关等。　　以下两种代码，均可直接运行。1、使用原生JS：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></...
复制链接

扫一扫