JS-跨域请求豆瓣API提供的数据

跨域请求豆瓣API提供的数据

1.html代码先写ul用来显示请求得来的数据

    <div class="container-fluid">
        <div class="page-title">
            <h1>最新电影榜单</h1>
        </div>
        <ul id="movies"></ul>
    </div>

　

2.js代码

　写法一：先定义函数，然后传入"?callback=回调函数的名字"参数，这样就能返回函数的调用形式foo()

<script>
    //通过跨域请求豆瓣,如果传入回调函数，则返回的就是调用回调函数的形式
    function foo(res) {
        console.log(res);
    }
</script>
<script src="https://douban.uieee.com/v2/movie/in_theaters?callback=foo"></script>

　　

 

写法二：直接上跨域请求了

 

<script>
    $.ajax({
        url : 'https://douban.uieee.com/v2/movie/in_theaters',
        dataType : 'jsonp',
        success : function (res) {
            var subjects = res.subjects;
            //呈现数据,将数组转化为jq对象就能遍历了
            $(subjects).each(function (i,item) {
                console.log(i,item);
                $('#movies').append('<img src="'+item.images.small+ '"><li>' + item.title + '</li>')
            })
        }
    })
</script>