ajax详解-有何不可

ajax详解

Davidvivi
2016-02-23 21:28:58
PHP
ajax

加油吧！Davidvivi

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>

本文为Davidvivi原创文章,转载无需和我联系,但请注明来自Davidvivi博客weixia.xin 本人微信：ww646904527,备注博客

打赏,支持一下