热门关键字:
jquery > jquery教程 > jquery教程 > Ajax+Json+JQuery+案例演示知识整理

Ajax+Json+JQuery+案例演示知识整理

258
作者:管理员
发布时间:2021/6/8 15:51:25
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=4902
  Ajax介绍


  ajax支持异步访问,网页局部刷新。


  在java中,主要是依赖于核心对象:XMLHttpRequest。


  js原生Ajax的开发(4步骤)【了解】


  说明:XMLHttpRequest对象【onreadystatechange 、readyState 、status、responseText】


  代码演示


  点击页面按钮发送请求到后台Servlet;后台Servlet接收数据后,给出响应;页面接收响应数据;


  【Ajax原生的GET请求】


  【Ajax原生的POST请求】


  【AjaxGetServlet.java】


  Ajax异步请求axios【主流】


  是一个基于的HTTP库,可以用在浏览器和node.js中。


  Axios中文官网


  axios说明网站:(


  简单来说,就是对进行了一次封装。通过使用,我们能够在项目中很便捷轻松地发送HTTP请求。


  原生ajax请求的代码编写太过繁琐,我们可以使用axios这个库来简化操作!


  在Vue(前端框架)中发送异步请求,使用的就是axios。


  需要注意的是axios不是vue的插件,它可以独立使用。


  axios常用方法


  axios开发Ajax(3步骤)


  1.引入axios核心js文件。


  2、使用axios对象调用方法来发起异步请求。


  axios的get 、 post请求方式的区别


  并且我们对于需要使用回调函数的位置可以使用es6的箭头函数简化代码书写【箭头函数体省略书写,思想和java中lambda省略思想是一样的】


  3、使用axios对象调用方法来处理响应的数据。


  代码演示


  需求:


  a. 有一个注册的表单, 有注册用户名和密码,一个提交按钮


  b. 用户名输完之后,检测这个用户名是否可用(绑定onblur事件)


  c. 就算服务器没有立即响应, 用户还能继续在表单上操作 -> 异步


  register.html


  RegisterServlet.java


  Json介绍


  xml: 张三


  json: {“name”:“张三”}


  JSON是javascript的原生对象。 javascript Object notation


  JSON 是一种轻量级的数据交换格式。它基于ECMAScript的一个子集,


  采用完全独立于编程语言的文本格式来存储和表示数据。


  简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。


  易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。


  语法格式


  JSON数据有三种数据格式,分别如下:


  【注意】


  JSON对象和JSON字符串


  1、JSON在js中属于对象。在java中输入字符串


  2、如果是一个字符串,不能使用json变量调用key方式获取value,需要使用函数parse将字符串进行转换为json对象之后才可以使用对象调用key获取value


  JSON对象


  JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation)。


  JSON 格式在语法上与创建 JavaScript 对象代码是相同的。


  因此,可以把JSON看成是JavaScript对象。




如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:jquery
友荐云推荐