Ajax 笔记 01

发布于:2024-04-26 ⋅ 阅读:(18) ⋅ 点赞:(0)
01 ajax的基本使用

        ajax五步骤:

                1.构建异步请求对象

                2.调用open方法 传入请求方式 服务器地址等参数

                3.调用send方法 发起网络请求

                4.注册请求对象的状态改变事件

                5.在状态改变事件里面 判断当前状态 并取得返回值

02 get方式向服务器发送数据

        ajax的get方式向服务器提交数据:

                ajax.open('请求方式','服务器地址?键1=值1&键2=值2.....')

03 ajax的post方式向服务器发送数据

        ajax的post方式向服务器发送数据:

                ajax对象.send('键1=值1&键2=值2.....')

                前提是ajax必须设置一个请求头 才能使得post数据提交成功

        设置请求头:

                ajax对象.setRequestHeader("键","值");

                ajax对象.setRequestHeader("Content-type","application/x-www-form-urlencoded")

                ajax对象.setRequestHeader("Content-type","multipart/form-data")

                ajax对象.setRequestHeader("Content-type","application/json")

        响应:

                响应码:

                        200  'ok'

                        404  'not  found' 

                        304   '从缓存中读取'

                        302   转发

                        500   'internal  error'  服务器内部错误

        请求头:

                包含本次请求的一些相关信息

                比如 请求的地址

                        当前网页的数据的地址

                        提交数据内容的类型

                        提交的数据的长度

                        数据的格式

                        数据的编码格式

        响应头:

                服务器版本 

                服务器语言类型

                服务器返回的数据类型

                数据长度

        GET与POST的区别:

                GET:

                        提交的参数在请求地址的后面拼接

                        参数大小限制3~4k

                        get偏向于数据获取

                        get相对速度快

                        get相对不安全

                                get请求可以被加入收藏夹 有历史记录 会被加入书签

                POST:

                        提交的数据在send里面(隐式传递)

                        参数的大小没有限制

                        (体积大的数据可以使用mulltipart/form-data格式进行二进制流   分段进行传递)

                        post偏向于提交数据

                        post相对速度慢

                        post相对安全

                                post请求不可以被加入收藏夹  没有历史记录

04 JQ中ajax的使用

        jq的ajax方法 可以进行全配置 的访问服务器

        $.ajax(option对象)

        option对象的常用属性:

                url   服务器地址

                type   请求方式(get/post)

                data:{ }  提交的参数

                success : function(){ }  成功的回调

                error : function(){ }  失败的回调

                timeout:3000   请求的超时时间

                headers : { } 设置自定义请求头

                dataType : " "  返回数据类型的预处理

        不常用属性:

                beforeSend:function(xhr){ } 网络请求发起之前

        跨域属性:

                jsonp

                jsonpCallback


网站公告

今日签到

点亮在社区的每一天
去签到