原生Aajax 和jQuery Ajax 写法个人总结


Posted in jQuery onMarch 24, 2017

AJAX:即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。

通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

传统的网页(不使用 AJAX)如果需要更新内容,必须重载整个网页页面。

一个完整的HTTP请求:由请求方式、URL、请求头和请求体组成;

一个完整的HTTP响应:由状态码、响应头、响应体组成;

http状态码:1开头 代表信息类 正在处理、2开头代表请求成功200 OK、3开头代表重定向、4开头代表客户端错误 404、5开头代表服务器错误;

响应状态:0,1,2,3,4  4代表响应成功。

open方法中的第三个参数代表是否异步(TRUE为异步   FALSE为同步)。

当请求方式为POST时,open方法后面要设置请求头(xmlhttp.setResponseHeader(""))send方法中要加入;

原生JavaScript写法:

var xhr;
  function rukou()//入口函数
  {
   xhr=getxhr();
   if(xhr==null)
   {
    alert("浏览器不支持!");
   }
   var url="";
   xhr.onreadystatechange=fanhui;
   xhr.open("GET",url,true);
   xhr.send(null);
  }
  function fanhui()//请求成功的回调函数
  {
   if(readyState==4)
   {
    document.getElementById("xx").innerHTML=xhr.responseText;
   }
  }
  function getxhr()//获取xmlhttp对象
  {
   xhr=null;
   try{
    xhr=new XMLHttpRequest();
   }
   catch(e)
   {
    xhr=new ActiveXObject("Microsoft.XMLHTTP");
   }
  }

jQuery中的ajax写法:

$("#tijiao").click(function(){
  $.ajax({
   type:"GET",
   url:"http://localhost/AJAX/test.php?name="+$("#name").val()+"&phone="+$("#phone").val(),
   dataType:"json",
   success:function(data){
    $("#success").html(data.msg);
   },
   error:function(){
    alert("错误!!!");
   }
  })
 })
$("#tijiao").click(function(){
  $.ajax({
   type:"POST",
   url:"test.php",
   data:{
    name:$("#name").val(),
    phone:$("#phone").val()
   },
   dataType:"json",
   success:function(data){
    $("#success").html(data.msg);
   },
   error:function(){
    alert("错误!!!");
   }
  })
 })

 以上所述是小编给大家介绍的原生Aajax 和jQuery Ajax 个人总结,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery实现动态生成表格并为行绑定单击变色动作的方法
Apr 17 jQuery
jQuery中hover方法搭配css的hover选择器,实现选中元素突出显示方法
May 08 jQuery
jquery+ajax实现省市区三级联动 (封装和不封装两种方式)
May 15 jQuery
jQuery正则验证注册页面经典实例
Jun 10 jQuery
jQuery条件分页 代替离线查询(附代码)
Aug 17 jQuery
jQuery选择器之表单元素选择器详解
Sep 19 jQuery
js和jQuery以及easyui实现对下拉框的指定赋值方法
Jan 23 jQuery
jquery实现的简单轮播图功能【适合新手】
Aug 17 jQuery
jQuery UI实现动画效果代码分享
Aug 19 jQuery
jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析
Mar 06 jQuery
JQuery实现折叠式菜单的详细代码
Jun 03 jQuery
jQuery实现查看图片功能
Dec 01 jQuery
jQuery实现的背景颜色渐变动画效果示例
Mar 24 #jQuery
jQuery插件FusionCharts实现的MSBar2D图效果示例【附demo源码】
Mar 24 #jQuery
jQuery编写textarea输入字数限制代码
Mar 23 #jQuery
jquery实现全选、全不选以及单选功能
Mar 23 #jQuery
jQuery插件FusionCharts实现的MSBar3D图效果示例【附demo源码】
Mar 23 #jQuery
纯jQuery实现前端分页功能
Mar 23 #jQuery
JQuery 进入页面默认给已赋值的复选框打钩
Mar 23 #jQuery
You might like
PHP实现通过Luhn算法校验信用卡卡号是否有效
2015/03/23 PHP
浅谈PHP中pack、unpack的详细用法
2018/03/12 PHP
Laravel5.5以下版本中如何自定义日志行为详解
2018/08/01 PHP
PHP检查文件是否存在,不存在自动创建及读取文件内容操作示例
2020/01/23 PHP
jQuery简单实现banner图片切换
2014/01/02 Javascript
JQuery判断checkbox是否选中及其它复选框操作方法合集
2015/06/01 Javascript
jQuery筛选数组之grep、each、inArray、map的用法及遍历json对象
2016/06/20 Javascript
利用JavaScript判断浏览器类型及版本
2016/08/23 Javascript
详解网站中图片日常使用以及优化手法
2017/01/09 Javascript
使用JavaScriptCore实现OC和JS交互详解
2017/03/28 Javascript
js禁止浏览器页面后退功能的实例(推荐)
2017/09/01 Javascript
详解Angular6 热加载配置方案
2018/08/18 Javascript
es6 symbol的实现方法示例
2019/04/02 Javascript
使用element-ui +Vue 解决 table 里包含表单验证的问题
2020/07/17 Javascript
微信小游戏中three.js离屏画布的示例代码
2020/10/12 Javascript
[54:54]Newbee vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
Python求两个list的差集、交集与并集的方法
2014/11/01 Python
10种检测Python程序运行时间、CPU和内存占用的方法
2015/04/01 Python
python验证码识别教程之利用滴水算法分割图片
2018/06/05 Python
python代理工具mitmproxy使用指南
2019/07/04 Python
python word转pdf代码实例
2019/08/16 Python
Django 实现外键去除自动添加的后缀‘_id’
2019/11/15 Python
python集合删除多种方法详解
2020/02/10 Python
JupyterNotebook 输出窗口的显示效果调整实现
2020/09/22 Python
用python获取txt文件中关键字的数量
2020/12/24 Python
12个不为大家熟知的HTML5设计小技巧
2016/06/02 HTML / CSS
密封类可以有虚函数吗
2014/08/11 面试题
String s = new String(“xyz”);创建了几个String Object?
2015/08/05 面试题
十八届三中全会学习方案
2014/02/16 职场文书
婚礼证婚人演讲稿
2014/09/13 职场文书
个人自查自纠材料
2014/10/14 职场文书
公司股东出资证明书
2014/11/01 职场文书
解除劳动关系协议书2篇
2014/11/28 职场文书
养成教育工作总结
2015/08/13 职场文书
Window server中安装Redis的超详细教程
2021/11/17 Redis
Win11 Build 21996.1 Dev版怎么样? win11系统截图欣赏
2021/11/21 数码科技