ajax详解

AJAX 指异步 JavaScript 及 XML

AJAX不是一个新的技术，而是一个使用现有的技术的新方法( XMLHttpRequest )。

AJAX不能查数据库，他可以请求(get/post)一个PHP文件。让这个PHP文件查询数据。

<script type="text/javascript">
        var request;
        if(window.XMLHttpRequest){  
            request = new XMLHttpRequest; //IE7,Firefox,Chrome,opera,Safari
        }else{  
            request = new ActiveXObject("Microsoft.XMLHTTP");  //IE6.IE5
        }

        console.log(request);

    </script>

get与post区别：
1、post提交的数据大小理论没有限制，get一般有限制( 浏览器 )
2、安全性， post更安全，get相对不安全
3、get是通过url参数数据，post通过表单

从http协议角度出发：
get与post的区别：一般认为get是用来获取数据的，post是向服务器提交数据的。
协议本身没有对get/post的大小做限制，get的数据传输大小有限制，是浏览器限制的

ajax的get请求

 //1.得到一个对象
        var ajax = new XMLHttpRequest();


        // 2.  选择请求方式打开那个PHP文件，
        //open('get/post', '请求的PHP文件的路径', true/false);//true代表异步，false是同步
        ajax.open('get', './php/1.php?name='+uname, true);



        // 3. 确认、发送请求
        ajax.send();


        // 4.获取服务器给我们返回的数据
        ajax.onreadystatechange = function(){//当状态改变的时候，就执行我们匿名函数
            //只关心readyState == 4的状态
            if( ajax.readyState == 4  && ajax.status == 200 ){

                //ajax.status  获取到http的状态码。200代表成功
                console.log(ajax.status);

                //alert('请求成功');

                //拿到服务器的数据
                var res = ajax.responseText;//responseText  获取是响应的文本

                var box = document.getElementById('box');
                box.innerHTML = res;

            }
        }

ajax的post请求

<script>
        var ajax = new XMLHttpRequest();// XML + Http + Request

        ajax.open('post','./php/4.php', true);

        //在发送操作之前，先要进行编码
        //不用记住，其他的步骤要记住。
        ajax.setRequestHeader("Content-type","application/x-www-form-urlencoded");

        //post的方式，传递的参数写在send()方法里面
        ajax.send('id=1&name=jack');

        ajax.onreadystatechange = function(){

            if(ajax.readyState ==4 && ajax.status == 200){

                var res = ajax.responseText;

                console.log(res);
            }
        }
    </script>