Ajax学习(一)
时间:2019-10-22
本文章向大家介绍Ajax学习(一),主要包括Ajax学习(一)使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
常见的请求方式
- 标签的href和src(无法由用户进行控制)
- 在浏览器地址栏输入网址回车
- location.href
- 如果请求服务端的某个页面,记得设置http://部分
- form标签
- form的action表示表单提交给那个地址处理
- 表单元素必须设置name属性,否则数据无法正常提交
- 提交按钮的使用:
- input[type=submit] 提交按钮
- button[type=submit] 提交按钮 (默认type就是submit,设置时可以不写)
- button[type=button] 普通按钮
- input[type=button] 普通
- 小结:
- 统一的特点:页面会发生跳转。
同步和异步
单线程
js是单线程的语言。(只有一个人执行操作,同时只能做一件事)
- js在后期也引入了多线程的概念,但是还是只有一个主线程。
- 其他线程只能用于辅助操作,无法进行核心功能操作(DOM)
同步和异步
- 同步任务:
- 特点:按照顺序一个一个任务执行。
- 异步任务:
- 特点:异步任务都比较耗时或执行时间不确定
- 常见的异步任务有哪些:
- 定时器, 事件 ,Ajax
- 特点:异步任务的执行一定晚于同步任务
- 同步任务:
Ajax简介
为什么要学习ajax
- 网页中的很多功能需要发送请求,同时不能跳转,这时传统的请求方式就无法满足要求了。
- 就可以通过ajax来进行处理
什么是ajax
ajax是一种js进行请求响应处理的方式
特点:不会造成页面刷新
浏览器中的实现方式:
- 采用了内置对象的设置方式:
- new XMLHttpRequest();
- 采用了内置对象的设置方式:
名称全拼:Asynchronous JavaScript And Xml 异步的js和XML
- XML是早期使用的一种数据交互格式,现在都使用json进行操作
// 下面是json格式 (现在的常用格式) { "name": "jack", "age": 18 } // 下面是XML格式 <jieke> <name>jack</name> <age>18</age> </jieke>
ajax如何使用
- jQuery中的ajax使用
- 原生的ajax使用方式,以及功能的封装
- axios库
服务端功能使用
- 数据接口的相关内容:
- 含义:
- 可以提供数据的一个地址,通过请求这个地址,可以得到一些数据,这个地址就称为数据接口。
- 接口的使用一定要严格按照接口文档操作!!!
- 如果在工作中按照文档使用接口有问题,直接找后端的同事解决。
- 含义:
jQuery的ajax使用
$.ajax()的基本使用
如果响应的数据是JSON格式,jQuery会自动将JSON转换为js对象结构
$.ajax({
url: 'http://..', // 要请求的接口地址, 必须从接口文档中复制地址
success: function (res) { // 当响应成功的接收完毕,success会被执行
// res 表示响应的数据内容
}
});
原文地址:https://www.cnblogs.com/itxcr/p/11718956.html
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 动态规划入门_数塔问题
- Rust所有者被修改了会发生什么?
- 如何编写高质量代码
- 动态规划入门_钱币兑换问题
- Codeforces Round #547 (Div. 3)D. Colored Boots
- JavaScript 性能优化
- 优化循环的方法-循环展开
- 程序性能优化-局部性原理
- Codeforces Round #547 (Div. 3)E. Superhero Battle
- 《动态规划_入门 LIS 问题 》
- 栅格化系统的原理以及实现
- vue-qr二维码插件使用简介
- Codeforces Round #547 (Div. 3)F1. Same Sum Blocks (Easy)
- 手机软键盘弹起导致页面变形的一种解决方案
- Codeforces Round #547 (Div. 3)F2. Same Sum Blocks (Hard)