W:Ajax

Q:异步网络请求。无刷新请求数据。

W:ajax的实现流程如下:

Q:

  1. 创建XHR对象
  2. 调用open()方法,创建请求
  3. 调用send()方法,发送请求
  4. 捕获请求状态,判断请求结果
  5. 获取数据库返回的数据

W:xml参数

Q: XHR对象相关属性:
  • readyState:请求 /相应过程的当前活动阶段
  • responseText:作为响应主体被返回的文本
  • responseXML:如果相应的内容类型是text/xml或者application这个属性中将保存着响应数据的XMLDOM文档
  • status:相应的HTTP状态
  • statusText:HTTP状态说明

W:举个例子

//js部分

1.声明获取变量

var username = document.getElementById("username");

var passwd = document.getElementById("passwd");

var loginBtn = document.getElementById("loginBtn") loginBtn.onclick = function ()

{ //设置请求地址

var url = "login.php";

//提交内容

var postbody = "username="+username.value+"&passwd="+passwd.value;

//发起ajax请求,并使用回调函数实现功能

request("POST",url,postbody,function (resText)

{ //把json格式的字符串转换成对象

var obj = JSON.parse(resText); alert(obj.msg); });

}

W:ajax 使用

Q:使用$.ajax()方法

1.url:发送请求的地址

2.type:请求方式默认get(post/get)

3.async :默认true   为异步

4.data: 要求为object或 string 类型的参数

5.complete: 求完成后调用的回调函数(请求成功或失败时均调用)

6.success :  请求成功后调用的回调函数,有两个参数。
                 (1)由服务器返回,并根据dataType参数进行处理后的数据。
                 (2)描述状态的字符串。
                 function(data, textStatus){
                   //data可能是xmlDoc、jsonObj、html、text等等
                   this;  //调用本次ajax请求时传递的options参数
                }

ajax 个人理解 学习笔记的更多相关文章

  1. CSS深入理解学习笔记之absolute

    1.absolute和float 拥有相同的特性表现: ①包裹性(容器应用之后,可以包裹里面的内容): <!doctype html> <html> <head> ...

  2. CSS深入理解学习笔记之vertical-align

    1.vertical-align基本认识 支持的属性值: ①线类:baseline(默认),top,middle,bottom ②文本类:text-top,text-bottom ③上标下标类:sub ...

  3. CSS深入理解学习笔记之margin

    1.margin与容器尺寸 元素尺寸:①可视尺寸 clientWidth(标准):②占据尺寸 margin与可视尺寸:①适用于没有设定width/height的普通block元素:②只适用于水平方向尺 ...

  4. CSS深入理解学习笔记之float

    1.float的历史 float设计的初衷仅仅是为了文字环绕效果. 示例代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transit ...

  5. CSS深入理解学习笔记之overflow

    1.Overflow基本属性 overflow:visible(默认)/hidden/scroll/auto/inherit; visible:超出部分可见. hidden:超出部分隐藏. scrol ...

  6. CSS深入理解学习笔记之line-height

    1.line-height的定义 定义:两行文字基线之间的距离. 注:不同字体之间的基线是不同的. 2.line-height与行内框盒子模型 行内框盒子模型: ①内容区域(content area) ...

  7. CSS深入理解学习笔记之relative

    1.relative和absolute的相煎关系 限制作用:①限制left/top/right/bottom定位:②限制z-index层级:③限制在overflow下的嚣张气焰. relative和f ...

  8. CSS深入理解学习笔记之z-index

    1.z-index基础 z-index含义:指定了元素及其子元素的"z顺序",而"z顺序"可以决定元素的覆盖顺序.z-index值越大越在上面. z-index ...

  9. CSS深入理解学习笔记之padding

    1.padding与容器尺寸之间的关系 对于block水平元素:①padding值暴走,一定会影响尺寸:②width非auto,padding影响尺寸:③width为auto或box-sizing为b ...

随机推荐

  1. 跨浏览器的事件对象EventUtil

    var EventUtil = function(){ /*--addHandler--*/ addHandler:function(element,type,handler){ if(element ...

  2. 【题解】洛谷P4281 [AHOI2008] 紧急集合(求三个点LCA)

    洛谷P4281:https://www.luogu.org/problemnew/show/P4281 思路 答案所在的点必定是三个人所在点之间路径上的一点 本蒟蒻一开始的想法是:先求出2个点之间的L ...

  3. Python:文件的读取、创建、追加、删除、清空

    一.用Python创建一个新文件,内容是从0到9的整数, 每个数字占一行:#python>>>f=open('f.txt','w')    # r只读,w可写,a追加>> ...

  4. SQLserver高级编程

    1.数据库设计 数据库设计的重要性: 减少冗余,提高性能.易维护 数据库设计的步骤: 1.收集信息.标识对象.标识属性.标识关系(一对一.一对多.多对一.多对多) E-R图: 属性:定义实体的性质.实 ...

  5. Python 学习笔记(十一)Python语句(一)

    运算符和条件语句 算术运算符 运算符 描述 实例 + 加 - 两个对象相加 a + b 输出结果 30 - 减 - 得到负数或是一个数减去另一个数 a - b 输出结果 -10 * 乘 - 两个数相乘 ...

  6. 记录一次没有收集直方图优化器选择全表扫描导致CPU耗尽

    场景:数据库升级第二天,操作系统CPU使用率接近100%. 查看ash报告: 再看TOP SQL 具体SQL: select count(1) as chipinCount, sum(bets) as ...

  7. 工具 | Axure基础操作 No.3

    下午了,再来补一些学习,今天东西不多哦,感觉慢慢上手了. 1.设置元件禁用状态 2.设置单选按钮唯一选中 注意这里在浏览器中就只能唯一选中了. 3.设置图片上的文字 4.图片的切割和裁剪 5.嵌入多媒 ...

  8. Redis Sentinel 集群安装 step by step

    一. 准备材料 服务器 IP address 操作系统 位数 Redis 版本   CNT06CAH05 192.168.3.47 CentOS 6.5 x64 Redis-3.2.6 sentine ...

  9. SpringBoot整合Eureka搭建微服务

    1.创建一个services项目,添加三个子模块client(客户端).service(服务端).registry(注册中心) 1.1 创建一个services项目 1.2 添加pom.xml依赖 & ...

  10. 使用apt-get install时如何指定安装版本

    命令语法如下: sudo apt-get install package=version 例如: sudo apt-get install samba=2:4.4.5+dfsg-2ubuntu6