跨域访问

跨域访问
　　服务器收到请求是, 会检查该请求来源, 如果来源的客户端页面自己无法识别,
　　则会根据需求做出限制或者拒绝访问(例如: 黑客对服务器的攻击)

　　对于客户端, 浏览器的同源策略可限制对跨域资源的访问,
　　若其余服务器的域不相同, 则浏览器可能进行限制甚至拒绝访问.

　　但部分请求不受到同源策略的限制
　　<script>, <img>, <iframe>, <link> 这些包含 src 属性的标签可以加载跨域资源
　　基于这点可以实现跨域访问

Demo: 使用 js 实现跨域访问

$(function(){
    $("head").append("<script src = 'http://suggest.taobao.com/sug?code=utf-8&q=衣服&callback=showData'></script>")
})
//定义回调函数
function showData(data){
    //将js对象转换成json格式的字符串
    var json = JSON.stringify(data);
    //将字符串转换成 json 对象
    var objs = JSON.parse(json);
    for(var i=0;i<objs.result.length;i++){
        $("table").append("<tr>" + 
            "<td>"+objs.result[i][0]+"</td>" +
            "<td>"+objs.result[i][1]+"</td>" +
            " </tr>"    
        );
    }
}

Demo: 使用AJAX 实现跨域访问(jsonp 方式)
　　jsonp 实现跨域的访问只支持 get 请求

$(function(){
    //绑定事件
    $("a").click(emp_list_fun);
})
function emp_list_fun(){
    $.ajax({ //发送一个请求
        type:"post",
        url:"http://suggest.taobao.com/sug?code=utf-8&q=衣服&callback=showData",
        data:{"kw":"A","cp":1,"ls":10}, //传递的数据
        dataType:"jsonp", //实现跨域访问
        async:false, //实现请求没有完全处理之前锁定浏览器, 不做后面的操作
        success:function(data){
            for(var i=0;i<objs.result.length;i++){
                $("table").append("<tr>" + 
                    "<td>"+objs.result[i][0]+"</td>" +
                    "<td>"+objs.result[i][1]+"</td>" +
                    " </tr>"    
                );
            }
        }
    });
}