前端ajax技术之跨域问题解决

这里我使用jquery框架的ajax技术

 

<script type="text/javascript" src="Assets/js/jquery.min.js"></script>
<script type="text/javascript">
    function load1() {
        $(function () {
            $.ajax({
                url: 'http://192.168.1.107:3000/product',
                type: 'GET',
                dataType: 'jsonp',
                timeout: 1000,
                cache: false,
                beforeSend: LoadFunction, //加载执行方法
                error: erryFunction,  //错误执行方法
                success: succFunction //成功执行方法
            })
            function LoadFunction() {

            }

            function erryFunction() {
                alert("error");
            }

            function succFunction(data) {


                for (var o in data) {
                    $("#product").append("<li><img src='" + data[o].image + "'/><div class='des'><p>" + data[o].name + "</p><a href='details.html?id=" + data[o].id + "'>" + "+ 查看详情</a></div></li>");
                }
            }
        });
    }
    load1();
</script>
再次，各位博友可以查看我的随笔为nodejs搭建jsonapi接口为该例子的ajax的url地址，这里我使用了获取ul的id号，然后使用append方法向ul标签动态添加li标签，确保数据遍历