原生的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); //发送 });
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用法、json解释和jQuery选择器、dom操作、事件的讲解每一部分都有例子搭配,是学习熟悉jQuery的好资料!
内容包括 原生js的ajax与jQuery中的ajax 还包含了跨域的解决方法已经JSONP的原理及封装
原生js封装的ajax,使用上类似jquery一样便捷,里边有示例,可以参考
前言:ajax的神奇之处在于JavaScript 可在不重载页面的情况与 Web ...(1)html前端代码get请求方式创建一个ajax实例xhr open()方法传入三个参数,第一个是请求方式(一般为get和post),第二个参数是请求地址,第
Ajax被认为是(Asynchronous(异步) JavaScript And Xml的缩写)。现在,允许浏览器与服务器通信而无须刷新当前页面的技术都被叫做Ajax。这篇文章主要介绍了原生和jQuery的ajax用法,需要的朋友参考下吧
众所周知,jquery在我们日常开发中的使用频率非常高,与js相比,我们省去了冗长的获取元素的代码,不用考虑一些麻烦的兼容问题,更加方便的动画实现,以及更加方便的方法调用让我们觉得jquery真是越用越舒服。...
大家都知道jquery在我们日常开发中的使用频率非常高,但jquery说到底还是对js的封装,我们不能光会使用,只有知道了其中的远离才能更好的使用,所以这篇文章主要介绍的是原生js仿jquery实现对Ajax封装的方法。
AJAX不是新的编程语言,而是一种使用现有标准的新方法。AJAX是与服务器交换数据并更新部分网页的技术,在不重新加载整个页面的情况下。就是利用JS来无刷新与后端交互,通过get和post方式把数据发送到后端,或者请求...
本资源主要介绍了AJAX跨域的解决办法,以及解决方案间的比较
jquery是一个优秀的js框架,自然对js原生的ajax进行了封装,封装后的ajax的操作方法更简洁,功能更强大,与ajax操作相关的jquery方法有如下几种,但开发中经常使用的有三种: 1)$.get(url, [data], [callback], ...
项目中不需要加载jquery这种庞大的js插件要使用到ajax这种功能该如何办呢?下面和大家分享几种利用javascript实现原生ajax的方法
《超实用的jQuery代码段》从jQuery框架的使用原理与应用场景出发,对最实用的jQuery代码段进行了全方位的介绍和演示。全书分为11章,包含网页效果、DOM元素与属性、HTML事件、CSS样式、用户输入自动完成、拖放、图形...
主要介绍了实例讲解使用原生JavaScript处理AJAX请求的方法,这样就算是利用原生API而脱离了jQuery中的Ajax方法,需要的朋友可以参考下
和ES6的Promise对象长的有点像,jQuery的Deferred对象也有resolve、reject、then方法,还有done、fail、always……方法。jQuery就是用这个Deferred对象来注册异步操作的回调函数,修改并传递异步操作的状态。 玩玩...
一般来说,使用Jquery中的$.ajax,$.post,$.getJSON,非常方便,但是有的时候,我们只因为需要ajax功能而引入Jquery比较不划算。 所以接下来便用原生JavaScrpit实现一个简单的Ajax请求,并说明ajax请求中的跨域访问...
提示 我们将在第2章演示使用jQuery的AJAX工具和使用原生JavaScript进行AJAX开发有什么异同。 时至今日,已有很多的JavaScript库可用。最流行的JavaScript库有Prototype(http://www. prototypejs.org)、MooTools...
ajax操作-原生ajax ajax操作-JQuery的ajax ajax操作-伪ajax(iframe) ajax操作-时机选择 文件上传(3种方式)-1 文件上传-时机选择及预览-2 图片验证码 KindEditor基本使用和文件操作 作业 第25周 今日内容概要 ...
在这篇文章,我使用 Node.js作为后端。没错,这就可以全栈(浏览器和服务器)JS了。Node.js 是很简洁的,我鼓励你能在 Github下载demo,并关注该项目。下面是服务器端的代码: // app.js var app = ...