原生和jQuery的ajax用法

jQuery的ajax方法:

$.ajax({
    url:‘/comm/test1.php‘,
    type:‘POST‘, //GET
    async:true,    //或false,是否异步
    data:{
        name:‘yang‘,age:25
    },
    timeout:5000,    //超时时间
    dataType:‘json‘,    //返回的数据格式:json/xml/html/script/jsonp/text
    beforeSend:function(xhr){
        console.log(xhr)
        console.log(‘发送前‘)
    },
    success:function(data,textStatus,jqXHR){
        console.log(data)
        console.log(textStatus)
        console.log(jqXHR)
    },
    error:function(xhr,textStatus){
        console.log(‘错误‘)
        console.log(xhr)
        console.log(textStatus)
    },
    complete:function(){
        console.log(‘结束‘)
    }
})

原生的ajax方法:

$(‘#send‘).click(function(){
    //请求的5个阶段,对应readyState的值
        //0: 未初始化,send方法未调用;
        //1: 正在发送请求,send方法已调用;
        //2: 请求发送完毕,send方法执行完毕;
        //3: 正在解析响应内容;
        //4: 响应内容解析完毕;

    var data = ‘name=yang‘;
    var xhr = new XMLHttpRequest();        //创建一个ajax对象
    xhr.onreadystatechange = function(event){    //对ajax对象进行监听
        if(xhr.readyState == 4){    //4表示解析完毕
            if(xhr.status == 200){    //200为正常返回
                console.log(xhr)
            }
        }
    };
    xhr.open(‘POST‘,‘url‘,true);    //建立连接,参数一:发送方式,二:请求地址,三:是否异步,true为异步
    xhr.setRequestHeader(‘Content-type‘,‘application/x-www-form-urlencoded‘);    //可有可无
    xhr.send(data);        //发送
});
时间: 2024-10-06 10:25:49

原生和jQuery的ajax用法的相关文章

jQuery $.post $.ajax用法

jQuery $.post $.ajax用法 jQuery.post( url, [data], [callback], [type] ) :使用POST方式来进行异步请求 参数: url (String) : 发送请求的URL地址. data (Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示. callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法). type (Stri

利用Jsonp跨域大发888搭建请求数据(原生和Jquery的ajax请求),简单易懂!

前言 :本文示例部署大发888搭建QQ2952777280[] hxforum.com 在XAMPP建站集成软件包上,在localhost环境下进行测试 1.什么是跨域 由于浏览器同源策略,凡是发送请求url的协议.域名.端口三者之间任意一与当前页面地址不同即为跨域.存在跨域的情况 :(1)网络协议不同,如http协议访问https协议. (2)端口不同,如8080端口访问3000端口. (3)域名不同,如aaaa.com访问bbbb.com. (4)子域名不同,如java.ddd.com访问q

js原生ajax与jquery的ajax的用法区别

什么是ajax和原理? AJAX 是一种用于创建快速动态网页的技术. 通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据 XMLHttpRequest对象的基本属性: onreadtstatechange 每次状态改变所触发事件的时间处理程序. responseText 从服务器响应返回以字符串为形式的数据 responseXML 从服务器响应返回以XML(DOM兼容文档)数据对象 status 从服务器返回的数字代码 100-199 用于指定客户端应相应的某些动作. 2

Js原生Ajax和Jquery的Ajax

一.Ajax概述 1.什么是同步,什么是异步 同步现象:客户端发送请求到服务器端,当服务器返回响应之前,客户端都处于等待卡死状态 异步现象:客户端发送请求到服务器端,无论服务器是否返回响应,客户端都可以随意做其他事情,不会被卡死 2.Ajax的运行原理 页面发起请求,会将请求发送给浏览器内核中的Ajax引擎,Ajax引擎会提交请求到服务器端,在这段时间里,客户端可以任意进行任意操作,直到服务器端将数据返回给Ajax引擎后,会触发你设置的事件,从而执行自定义的js逻辑代码完成某种页面1 功能. 二

原生js和jquery发送ajax请求及封装

原生js                                   // ajax get 五部曲function ajax_get(url,data){ // 异步对象 var ajax=new XMLHttpRequest(); // 设置url和请求方式 // url方法 如果有数据要把数据拼接到url中?name=jack&age=20 if(data){ url+=?; url+=data; }else{}; ajax.open('get',url); // 发送请求 aja

jQuery中的ajax用法案例

什么是 AJAX? AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML). 简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示. 使用 AJAX 的应用程序案例:谷歌地图.腾讯微博.优酷视频.人人网等等. 关于 jQuery 与 AJAX jQuery 提供多个与 AJAX 有关的方法. 通过 jQuery AJAX 方法,您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本

通过原生js的ajax或jquery的ajax获取服务器的时间

在实际的业务逻辑中,经常是与时间相关的,而前端能获得的时间有两个:客户端的时间,服务器的时间.客户端时间通过 javascript中的Date对象可以获取,如 Java代码   var dt = new Date(); var tm = dt.getTime(); 那么tm就是客户端的时间,另外也可以通过对应的getFullYear(),getMonth(),getDate()取到对应的年月日等...但这个时间可靠吗?好吧,那取服务器时间吧经常用到的是后台写一个php,jsp,cgi,asp..

jQuery的ajax和原生的ajax方法

jQuery的ajax方法: $.ajax({ url:'/comm/test1.php', type:'POST', //GET async:true, //或false,是否异步 data:{ name:'yang',age:25 }, timeout:5000, //超时时间 dataType:'json', //返回的数据格式:json/xml/html/script/jsonp/text beforeSend:function(xhr){ console.log(xhr) consol

【第2章第300回】原生JS与jQuery对AJAX的实现

一.定义 W3C里这么解释AJAX: AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).AJAX 不是新的编程语言,而是一种使用现有标准的新方法.AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下. 就是利用JS来无刷新与后端交互,通过get和post方式把数据发送到后端,或者请求后端的数据,然后根据请求的数据进行改变DOM节点等操作,从而取消掉用form的submit方式一提交就会跳转页面的情况