异步加载之ajax

1 XMLHttpRequest

XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

var xmlhttp;
if (window.XMLHttpRequest)
{
    //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
    xmlhttp=new XMLHttpRequest();
}
else
{
    // IE6, IE5 浏览器执行代码
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

2 open&send

方法	参数
open(method,url,async)	规定请求的类型、URL 以及是否异步处理请求。 method：请求的类型；GET 或 POST url：文件在服务器上的位置 async：true（异步）或 false（同步）
send(string) 将请求发送到服务器。	string：仅用于 POST 请求

xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();

懒得详细写了。。。详情

下面是laravel项目中的自己胡乱搞的一个动态加载的demo：
对应的效果(下面的新闻)

<script>
    //ajax动态加载
    var page = 0;
    window.onload = function() { //页面加载触发点击加载
        document.getElementById("btn").click();
    };
    $.ajaxSetup({ //laravel csrf验证
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    function add(){

        $.ajax({
            dataType:"html",
            url:'/companynews_adax/'+page+'/'+'{{$company->name}}',
            type:'get',

            success:function(news) {
                var items = JSON.parse(news);
                if(page!=0) {
                    for (var i=0;i<items.length;i++)
                        $("#template").remove();
                }
                $.each(items, function(i, obj) {
                    $("#template").clone(true).insertBefore($("#template"));
                    $("#template").attr('style', 'display:block');

                    $("#newsTitle").text(obj[1]);
                    $("#newshref").attr('href',obj[0]);
                    $("#newsSource").text(obj[3]);
                    $("#newsTime").text(obj[2]);
                });
                page++;
            }
        });
    };

    $("#btn").click(function(event) {
        add();
    });
</script>