2024/11/21日 日志 关于AJAX & Axious异步框架 & JSON
AJAX
点击查看代码
-- AJAX
--
-- AJAX
-- 概念:AJAX(Asynchronous JavaScript And XML):异步的 JavaScript 和 XML
-- AJAX作用:
-- 1.与服务器进行数据交换:通过AJAX可以给服务器发送请求，并获取服务器响应的数据
-- 使用了AJAX和服务器进行通信，就可以使用 HTML+AJAX来替换JSP页面了
-- 2.异步交互:可以在不重新加载整个页面的情况下，与服务器交换数据并
-- 更新部分网页的技术，如:搜索联想、用户名是否可用校验，等等...
--
-- 同步 和 异步(xhr)
--
-- 同步和异步指的是服务器端和客户端之间的关系,(简单理解为是否是多线程操作)
--
-- AJAX快速入门
--
-- 1.编写AjaxServlet，并使用response输出字符串
-- 2.创建 XMLHttpRequest 对象:用于和服务器交换数据
-- var xmlhttp;
-- if(window.XMLHttpRequest) {
-- //code for lE7+, Firefox, Chrome, Opera, Safarixmlhttp=new XMLHttpRequest();
-- }else {
-- // code for IE6. IE5
-- xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"");
-- 3.向服务器发送请求
-- xmlhttp.open("GET"“url");
-- xmlhttp.send();/发送请求
-- 4.获取服务器响应数据
-- xmlhttp.onreadystatechange=function(){
-- if(xmlhttp.readyState ==4&& xmlhttp.status ==200){
-- alert(xmlhttp.responseText);
-- }
-- }
--
Axious异步框架
点击查看代码
-- Axios 异步框架
-- Axios 对原生的AJAX进行封装，简化书写官网:https://www.axios-http.cn
--
-- Axios 快速入门
-- 1.引入 axios 的js 文件
-- <script src="js/axios-0.18.0.js"></script>
-- 2.使用axios 发送请求，并获取响应结果
-- 例:
-- axios({
-- method:"get",
-- url:"http://localhost:8080/ajax-demo1/aJAXDemo1?username=zhangsan"
-- }).then(function (resp){
-- alert(resp.data);
-- })
-- axios({
-- method:"post",
-- url:"http://localhost:8080/ajax-demo1/aJAXDemo1",
-- data:"username=zhangsan"
-- }).then(function (resp){
-- alert(resp.data);
-- });
--
-- Axios 请求方式别名
-- 为了方便起见， Axios 已经为所有支持的请求方法提供了别名
-- axios.get(url[, config])
-- axios.delete(url[, config])
-- axios.head(url[, config])
-- axios.options(url[, config])
-- axios.post(url[, data[, config]])
-- axios.put(url[, data[, config]])
-- axios.patch(url[, data[, config]])
--
-- 发送 get请求
-- axios.get("url")
-- .then(function (resp){
-- alert(resp.data);
-- });
-- 发送 post请求
-- axios.post("ur!"“参数")
-- .then(tunction (resp){
-- alert(resp.data);
-- })
-- 方法名 作用
-- get(url) 发起GET方式请求
-- post(url,请求参数) 发起POST方式请求
--
JSON
点击查看代码
-- JSON
--
-- ·概念:JavaScript Object Notation。JavaScript 对象表示法
-- ·由于其语法简单，层次结构鲜明，现多用于作为数据载体，在网络中进行数据传输
-- JavaScript对象
-- {
-- name: "zhangsan"
-- age: 23,
-- city:"北京"
-- }
-- JSON
-- {
-- "name": "zhangsan"
-- "age": 23,
-- "city":"北京”
-- }
--
--
-- JSON 基础语法
-- 定义:
-- var 变量名={"key1":value1,
-- "key2": value2,
-- ...
-- };
-- 示例:
-- var json = {"name": "zhangsan",
-- "age": 23,
-- "addr":["北京”,“上海”,“西安”]
-- };
-- 获取数据:
-- 变量名.key
-- 如: json.name
--
-- value 的数据类型为:
-- -> 数字(整数或浮点数)
-- -> 字符串(在双引号中)
-- -> 逻辑值(true 或 false)
-- -> 数组(在方括号中)对象(在花括号中)
-- -> null
--
-- JSON数据和Java对象转换
-- · 请求数据:JSON字符串转为Java对象
-- · 响应数据:Java对象转为JSON字符串
--
-- · Fastjson是阿里巴巴提供的一个ava语言编写的高性能功能完善的JSON库，
-- 是目前Java语言中最快的JSON库，可以实现Java对象和JSON字符串的相互转换。
-- · 使用:
-- 1.导入坐标
-- <dependency>
-- <groupld>com.alibaba</groupld>
-- <artifactld>fastison</artifactld>
-- <version>1.2.62</version></dependency>
-- 2.Java对象转JSON
-- String jsonStr = JsoN.toJsONString(obj);
-- 3.JSON字符串转Java对象
-- User user=jSON.parseObiect(isonStr, User.class);
--
